/* 用户端和运营后台共用的样式（原 index.html 里的 <style>） */
@font-face{font-family:'Noto Sans SC';font-weight:400;font-display:swap;src:url(/shared/assets/fonts/yume-0.ttf) format('truetype')}
@font-face{font-family:'Noto Sans SC';font-weight:500;font-display:swap;src:url(/shared/assets/fonts/yume-1.ttf) format('truetype')}
@font-face{font-family:'Noto Sans SC';font-weight:600;font-display:swap;src:url(/shared/assets/fonts/yume-2.ttf) format('truetype')}
@font-face{font-family:'Noto Serif SC';font-weight:400;font-display:swap;src:url(/shared/assets/fonts/yume-3.ttf) format('truetype')}
@font-face{font-family:'Noto Serif SC';font-weight:600;font-display:swap;src:url(/shared/assets/fonts/yume-4.ttf) format('truetype')}
  /* Yume UI v1 设计规范：默认夜色，不跟随系统；用户在「我的 → 外观」切到昼色（html[data-theme=light]）；旧变量名映射到新 token */
  :root {
    color-scheme: dark;
    --bg-000:#0a0f1a; --bg-100:#121a28; --bg-200:#1a2333; --bg-300:#232e41;
    --line-100:rgba(255,255,255,.08); --line-200:rgba(255,255,255,.16);
    --text-100:#eef1f6; --text-200:#a9b2c3; --text-300:#8590a2; --text-400:#4a5466;
    --brand:#7ee0c8; --brand-hover:#9ae9d6; --brand-pressed:#5fcdb2; --on-brand:#06231d; --brand-text:#7ee0c8; --brand-soft:rgba(126,224,200,.12);
    --accent-violet:#b9a6f5; --success:#5bd69a; --warning:#f2c46d; --danger:#ff7a7a; --info:#8ab4ff;
    --shadow-brand:0 8px 24px rgba(126,224,200,.22);
    --font-serif:"Noto Serif SC","Noto Serif JP","Songti SC","Hiragino Mincho ProN",serif;
    --font-sans:Inter,"PingFang SC","HarmonyOS Sans SC","Hiragino Sans","Noto Sans SC","Microsoft YaHei",system-ui,sans-serif;
    --radius-sm:6px; --radius-md:12px; --radius-lg:16px; --radius-xl:24px;
    /* 旧变量别名 */
    --bg:var(--bg-000); --glow1:transparent; --glow2:transparent;
    --card:var(--bg-100); --card2:var(--bg-300); --border:var(--line-100);
    --fg:var(--text-100); --muted:var(--text-300); --accent:var(--brand-text); --accent2:var(--brand);
    --grad:linear-gradient(var(--brand),var(--brand));
    --bubble:var(--bg-200); --shadow:0 0 0 1px rgba(255,255,255,.06); --bar:rgba(10,15,26,.86);
    --hh:64px;
  }
  :root[data-theme="light"] {
      color-scheme: light;
      --bg-000:#f6f7fa; --bg-100:#ffffff; --bg-200:#ffffff; --bg-300:#eef1f5;
      --line-100:rgba(10,15,26,.08); --line-200:rgba(10,15,26,.16);
      --text-100:#141a26; --text-200:#4a5468; --text-300:#6b7486; --text-400:#b3bac6;
      --brand:#2fbf9f; --brand-hover:#28ad8f; --brand-pressed:#22977d; --on-brand:#04211b; --brand-text:#0b7f69; --brand-soft:rgba(47,191,159,.12);
      --accent-violet:#7b61d9; --success:#16804f; --warning:#9a6200; --danger:#c7322f; --info:#2a5fc2;
      --shadow-brand:0 8px 20px rgba(47,191,159,.28);
      --shadow:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08); --bar:rgba(255,255,255,.88);
  }
  * { box-sizing:border-box; }
  @keyframes pageIn { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
  #view > * { animation:pageIn .22s ease; }
  #view > .pp.skel { animation:none; }
  .sk-line { height:16px; margin:14px 0; border-radius:8px; width:100%; background:linear-gradient(90deg,var(--card2) 25%,var(--card) 50%,var(--card2) 75%); background-size:200% 100%; animation:shimmer 1.2s linear infinite; }
  .sk-line.w80 { width:80%; } .sk-line.w60 { width:60%; height:26px; } .sk-line.w40 { width:40%; }
  @keyframes shimmer { to { background-position:-200% 0; } }
  body {
    margin:0; color:var(--fg); font:14px/1.6 var(--font-sans);
    background:var(--bg-000);
    -webkit-font-smoothing:antialiased;
  }
  a { color:var(--accent); }
  ::selection { background:color-mix(in srgb,var(--accent2) 35%,transparent); }
  ::-webkit-scrollbar { width:8px; height:8px; } ::-webkit-scrollbar-thumb { background:var(--border); border-radius:8px; }

  /* ---------- header / nav ---------- */
  header { position:sticky; top:0; z-index:40; height:var(--hh); display:flex; align-items:center; gap:16px; padding:0 28px;
    background:var(--bar); backdrop-filter:saturate(1.6) blur(18px); -webkit-backdrop-filter:saturate(1.6) blur(18px); border-bottom:1px solid var(--border); }
  .logo { margin:0; font-size:22px; font-weight:800; letter-spacing:.4px; cursor:pointer; white-space:nowrap; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
  nav { display:flex; gap:4px; flex:1; margin-left:10px; align-items:center; }
  nav button { display:flex; align-items:center; gap:6px; padding:8px 15px; border:0; border-radius:999px; background:none; color:var(--muted); font-weight:600; }
  nav button i { font-style:normal; }
  nav button:hover { color:var(--fg); background:var(--card2); transform:none; }
  nav button.active { color:#fff; background:var(--grad); box-shadow:0 4px 14px rgba(126,224,200,.35); }
  .userbox { display:flex; align-items:center; gap:10px; margin-left:auto; }
  .whobtn { display:flex; align-items:center; gap:8px; padding:4px 12px 4px 4px; border-radius:999px; font-size:13px; font-weight:600; max-width:200px; }
  .whobtn .wav { width:28px; height:28px; border-radius:50%; overflow:hidden; display:grid; place-items:center; color:#fff; font-size:13px; flex:none; background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .whobtn .wav img { width:100%; height:100%; object-fit:cover; } .whobtn .wn { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #uilang { width:auto; padding:6px 28px 6px 12px; border-radius:10px; font-size:13px; appearance:none; -webkit-appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237d7d99' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; background-size:12px; }
  .langbox { display:flex; align-items:center; gap:8px; } body.hide-lang #uilang { display:none; }      /* 用户端：登录后语言在「我的 → 语言」里设置，顶栏不放语言选择框（游客没有「我的」，仍显示） */
  #nav-mine { display:none; }
  .userbox { display:flex; align-items:center; gap:10px; }

  main { max-width:1040px; margin:0 auto; padding:28px 24px 48px; }

  /* ---------- controls ---------- */
  button { font:inherit; cursor:pointer; border:1px solid var(--border); border-radius:12px; padding:9px 16px; background:var(--card2); color:var(--fg);
    transition:transform .15s ease, box-shadow .15s ease, background .15s ease, opacity .15s; }
  button:hover { transform:translateY(-1px); }
  button:active { transform:translateY(0) scale(.98); }
  button:disabled { opacity:.5; cursor:default; transform:none; }
  button.primary { border:0; color:#fff; background:var(--grad); box-shadow:0 6px 18px rgba(126,224,200,.35); font-weight:600; }
  button.primary:hover { box-shadow:0 8px 24px rgba(126,224,200,.4); }
  input, textarea, select { font:inherit; width:100%; padding:11px 14px; border-radius:14px; border:1px solid var(--border); background:var(--card2); color:var(--fg); outline:none; transition:border-color .15s, box-shadow .15s; }
  input:focus, textarea:focus, select:focus { border-color:var(--accent2); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 24%,transparent); }
  /* 下拉框统一用自己画的箭头：原生箭头贴着右边框、和圆角挨得太近。右边留出位置，文字不压箭头；个别下拉框（下面各处）自己的写法仍然优先 */
  select:not([multiple]):not([size]) { appearance:none; -webkit-appearance:none; cursor:pointer; padding-right:40px; text-overflow:ellipsis; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237d7d99' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 16px center; background-size:12px; }
  .post-sort select { padding-right:18px; background-position:right 0 center; }
  ::placeholder { color:var(--muted); opacity:.75; }
  input[type=checkbox], input[type=radio] { accent-color:var(--accent); }
  form label { display:block; margin:16px 0 6px; font-size:13px; font-weight:600; color:var(--muted); }
  h2 { font-size:22px; margin:0 0 6px; }
  .muted { color:var(--muted); }
  .empty { text-align:center; color:var(--muted); padding:64px 0; }
  .empty b { display:block; font-size:44px; margin-bottom:8px; }
  .err { color:var(--accent); min-height:1.4em; font-size:13px; }

  /* ---------- home ---------- */
  .hero { padding:8px 0 22px; }
  .hero h2 { font-size:clamp(26px,4.2vw,38px); font-weight:800; line-height:1.2; margin:0 0 8px; letter-spacing:.3px; }
  .grad { background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .hero p { margin:0; color:var(--muted); }
  .tabs { display:inline-flex; gap:2px; padding:4px; border-radius:999px; background:var(--card2); border:1px solid var(--border); margin-bottom:16px; }
  .filterrow { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:0 0 14px; } .filterrow .tabs { margin-bottom:0; padding:0; gap:8px; background:none; border:0; } .filterrow .tabs button { padding:5px 12px; font-size:13px; font-weight:500; background:none; } .filterrow .tabs button.active { background:color-mix(in srgb,var(--accent2) 14%,transparent); color:var(--accent2); font-weight:600; box-shadow:none; } .filterrow .tabs .cnt, .filterrow .tabs button { white-space:nowrap; } .filterrow select { flex:none; margin-left:auto; color:var(--muted); }
  .kindtabs.big { display:flex; align-items:center; gap:22px; margin:0 0 12px; } .kindtabs.big button { font-size:20px; font-weight:700; padding:6px 2px 10px; }
  .tabs button { border:0; background:none; border-radius:999px; padding:8px 20px; font-weight:600; color:var(--muted); }
  .tabs button:hover { transform:none; color:var(--fg); }
  .tabs button.active { background:var(--grad); color:#fff; box-shadow:0 4px 14px rgba(126,224,200,.35); }
  .toolbar { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:22px; align-items:center; }
  .toolbar input { flex:1; min-width:220px; padding-left:16px; border-radius:999px; }
  .toolbar button { border-radius:999px; padding:6px 13px; font-size:13px; background:var(--card); }
  .toolbar button:hover { border-color:var(--accent2); color:var(--accent); }
  .sec0 { margin:6px 0 14px; font-size:19px; } .sec0 small { font-size:12px; font-weight:400; margin-left:6px; }
  .tabs small { font-size:11px; opacity:.8; }
  .hscroll { display:flex; gap:16px; overflow-x:auto; padding:4px 2px 14px; scroll-snap-type:x proximity; -webkit-overflow-scrolling:touch; }
  .hscroll > * { flex:none; scroll-snap-align:start; }
  .hscroll > .card.plot { width:220px; }
  .ccard { width:200px; display:flex; flex-direction:column; gap:3px; align-items:center; text-align:center; padding:20px 14px 16px; border-radius:20px; cursor:pointer;
    background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); transition:transform .22s, border-color .22s; }
  .ccard:hover { transform:translateY(-4px); border-color:color-mix(in srgb,var(--accent2) 55%,transparent); }
  .ccard .cav { width:64px; height:64px; border-radius:50%; display:grid; place-items:center; font-size:28px; font-weight:800; color:#fff; margin-bottom:6px;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .ccard b { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ccard small { color:var(--muted); font-size:12px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .ccard small.top { margin-top:4px; }
  .grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:12px; }      /* 卡片之间的缝隙收紧：图是主角 */
  @media (max-width:720px) { .grid { gap:3px; } }
  .card { position:relative; background:var(--card); border:1px solid var(--border); border-radius:20px; cursor:pointer; overflow:hidden;
    box-shadow:var(--shadow); transition:transform .22s cubic-bezier(.2,.8,.2,1), box-shadow .22s, border-color .22s; }
  .card:hover { transform:translateY(-6px); border-color:color-mix(in srgb,var(--accent2) 55%,transparent); box-shadow:0 18px 44px rgba(126,224,200,.25); }
  /* 剧情卡片：整张图铺满，文字压在图的下半部分的渐变上，但内容精简（标题 + 两行简介 + 一行标签），让图占大头 */
  .card.plot { display:block; padding:0; aspect-ratio:2/3; color:#fff; border-radius:12px; border:0; box-shadow:none; }      /* 扁平：不要边框和阴影，图连成一面墙 */
  .card.plot:hover { box-shadow:0 10px 28px rgba(126,224,200,.28); }      /* 更高一点、圆角更小：人脸有更多空间，整页更像一面图墙 */
  .card.plot .cover { position:absolute; inset:0; height:auto; font-size:92px; padding-bottom:26%; }
  .card.plot .pbody { position:absolute; left:0; right:0; bottom:0; z-index:1; padding:44px 14px 14px; gap:4px;
    background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.6) 52%,transparent 100%); }
  .card.plot .pbody h3 { font-size:15px; line-height:1.3; text-shadow:0 1px 4px rgba(0,0,0,.5); display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
  .card.plot .syn { color:rgba(255,255,255,.8); font-size:12px; line-height:1.42; }
  .card.plot .pplug { margin:0; font-size:12.5px; color:#ffd9a8; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }      /* 用了哪些插件：最多一行，放不下的省略号 */
  .card.plot .pmeta { margin:2px 0 0; display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:11.5px; color:rgba(255,255,255,.72); }
  .card.plot .pmeta .pcreator { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:flex; align-items:center; gap:5px; }      /* 头像 + @名字：名字太长省略号，头像不被挤掉 */
  .card.plot .pmeta .pav { flex:none; width:16px; height:16px; border-radius:50%; overflow:hidden; display:grid; place-items:center; font-style:normal; font-size:10px; line-height:1; background:rgba(255,255,255,.22); } .card.plot .pmeta .pav img { width:100%; height:100%; object-fit:cover; display:block; } .card.plot .pmeta .pcreator[data-owner]:hover { color:#fff; text-decoration:underline; }
  .card.plot .pmeta .pheat { flex:none; font-weight:600; font-variant-numeric:tabular-nums; }
  .card.plot .ptags { margin:0; font-size:12.5px; color:rgba(255,255,255,.62); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .card.plot .flags { position:absolute; z-index:2; top:10px; left:10px; display:flex; gap:6px; }
  .card.plot .flags .flag { position:static; }
  .card.plot:hover .cover span { transform:scale(1.15) rotate(-4deg); }
  .cover { position:relative; height:132px; display:grid; place-items:center; font-size:58px; overflow:hidden;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .cover::before, .cover::after { content:""; position:absolute; border-radius:50%; background:rgba(255,255,255,.16); filter:blur(2px); }
  .cover::before { width:150px; height:150px; right:-40px; top:-60px; }
  .cover::after { width:90px; height:90px; left:-24px; bottom:-40px; background:rgba(0,0,0,.14); }
  .cover span { position:relative; z-index:1; filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); transition:transform .3s; }
  .card:hover .cover span { transform:scale(1.15) rotate(-4deg); }
  .cover em { font-style:normal; }
  .cover > img.cimg { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; z-index:0; }
  .card:hover .cover > img.cimg { transform:scale(1.05); } .cover > img.cimg { transition:transform .3s; }
  .cover .flag { position:absolute; z-index:2; top:10px; left:10px; font-size:11px; font-weight:700; padding:3px 10px; border-radius:999px; color:#fff; background:rgba(0,0,0,.38); backdrop-filter:blur(6px); }
  .cover .heat { position:absolute; z-index:2; top:10px; right:10px; font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px; color:#fff; background:rgba(0,0,0,.38); backdrop-filter:blur(6px); }
  .pbody { padding:14px 16px 16px; display:flex; flex-direction:column; gap:8px; flex:1; }
  .pbody h3 { margin:0; font-size:17px; line-height:1.3; }
  .syn { margin:0; color:var(--muted); font-size:13px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .cast { display:flex; align-items:center; }
  .cast .avatar { width:26px; height:26px; font-size:14px; margin-left:-7px; border:2px solid var(--bg); }
  .cast .avatar:first-child { margin-left:0; }
  .cast .names { margin-left:8px; font-size:12px; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .tags { display:flex; gap:6px; flex-wrap:wrap; margin-top:auto; padding-top:4px; }
  .tag { display:inline-block; font-size:11px; padding:2px 10px; border-radius:999px; background:var(--card2); color:var(--muted); border:1px solid var(--border); }
  .card.char { aspect-ratio:3/4; padding:0; color:#fff;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .card.char > img.full { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 20%; transition:transform .4s; }
  .card.char:hover > img.full { transform:scale(1.06); }
  .card.char .emo { position:absolute; inset:0 0 38% 0; display:grid; place-items:center; font-size:84px; filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); }
  .card.char .info { position:absolute; left:0; right:0; bottom:0; z-index:1; padding:44px 14px 14px; text-align:left;
    background:linear-gradient(to top,rgba(0,0,0,.82) 0%,rgba(0,0,0,.55) 55%,transparent 100%); }
  .card.char h3 { margin:0 0 3px; font-size:17px; text-shadow:0 1px 4px rgba(0,0,0,.5); }
  .card.char p { margin:0 0 8px; color:rgba(255,255,255,.82); font-size:12.5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  .card.char .tags { margin-top:0; padding-top:0; }
  .card.char .tag { background:rgba(255,255,255,.16); border-color:rgba(255,255,255,.22); color:#fff; backdrop-filter:blur(6px); }
  .card.char .heat2 { position:absolute; z-index:2; top:10px; right:10px; font-size:11px; font-weight:600; padding:3px 9px; border-radius:999px; color:#fff; background:rgba(0,0,0,.38); backdrop-filter:blur(6px); }
  .avatar { flex:none; display:grid; place-items:center; border-radius:50%; overflow:hidden; background:var(--card2); font-size:30px; width:56px; height:56px; box-shadow:0 0 0 2px transparent, 0 4px 14px rgba(0,0,0,.18);
    background-clip:padding-box; position:relative; }
  .avatar img { width:100%; height:100%; object-fit:cover; }

  /* ---------- chat ---------- */
  .chat { --h:330; max-width:840px; margin:0 auto; height:calc(100dvh - var(--hh) - 56px); min-height:420px; display:flex; flex-direction:column;
    border-radius:26px; overflow:hidden; border:1px solid var(--border); box-shadow:var(--shadow);
    background:linear-gradient(180deg,hsl(var(--h) 75% 55% / .16),transparent 46%),var(--card); }
  .chat-head { display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border); background:var(--bar); backdrop-filter:blur(14px); }
  .chat-head .ct { flex:1; min-width:0; } .chat-head b { font-size:17px; display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .chat-head .muted { font-size:12px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .bk { display:block; } button:has(> .bk) { display:inline-grid; place-items:center; }
  .chat-head .hbtn { width:38px; height:38px; padding:0; border:0; background:none; font-size:30px; line-height:1; border-radius:50%; flex:none; }
  .mdlpill { display:inline-flex; align-items:center; gap:6px; width:auto !important; flex:none; padding:5px 11px !important; border-radius:999px !important; border:1px solid var(--border); background:var(--card2); color:var(--fg); font-weight:600; font-size:12.5px !important; line-height:1.4; box-shadow:none; }
  .mdlpill svg { opacity:.65; flex:none; }
  .mdl-sub { color:#9a9aa5; font-size:13.5px; line-height:1.6; margin:2px 4px 14px; }
  .mdl-card { position:relative; display:flex; flex-direction:column; align-items:flex-start; gap:6px; width:100%; text-align:left; padding:16px 16px 14px; margin-bottom:10px; border:1px solid rgba(255,255,255,.1); border-radius:16px; background:#2d2d2d; color:#eee; }
  .mdl-card.on { border-color:var(--brand); background:var(--brand-soft); } .mdl-card.top:not(.on) { border-color:rgba(255,200,120,.35); background:linear-gradient(135deg,#2d2d2d,#352c26); }
  .mdl-name { font-size:24px; font-weight:700; letter-spacing:.3px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .mdl-name em { font-style:normal; font-size:12px; font-weight:600; padding:2px 9px; border-radius:999px; background:linear-gradient(90deg,var(--brand),#ec4899); color:#fff; letter-spacing:0; }
  .mdl-desc { color:#c9c9d1; font-size:14.5px; line-height:1.55; padding-right:28px; } .mdl-price { color:#a78bfa; font-size:14px; font-weight:600; }
  .mdl-ck { display:none; position:absolute; right:16px; top:16px; font-style:normal; font-size:20px; color:#ddd; } .mdl-card.on .mdl-ck { display:block; }
  .chat { position:relative; }
  .chat-bottom { position:relative; flex:none; }
  .card-in { opacity:0; animation:cardin .45s ease forwards; } @keyframes cardin { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
  .chat:has(.ctlrow .imgbtn:not([hidden])) .msgs { padding-bottom:68px; }      /* 生成画面 / 视频按钮浮在输入栏上方：给对话底部留出位置，不挡住最后一条 */
  .chat:has(.ctlrow .imgbtn:not([hidden])) .msgend { margin-bottom:-60px; }      /* 有生成画面 / 视频按钮时，重新生成那两个小图标落进同一排（和它们底边对齐），不再单独占一行 */
  .ctlrow { position:absolute; left:0; right:0; bottom:100%; display:flex; align-items:flex-end; justify-content:flex-start; gap:10px; padding:0 14px 8px; pointer-events:none; z-index:5; }
  .ctlrow > * { pointer-events:auto; }
  .msgend { display:flex; justify-content:flex-end; align-items:flex-end; gap:8px; min-height:52px; flex:none; } .msgend[hidden] { display:none; }
  .imgbtn { display:flex; flex-direction:column; align-items:center; gap:2px; padding:4px 6px; border:0; background:none; border-radius:12px; font-size:11px; color:var(--muted); text-shadow:0 1px 2px var(--bg); }
  .imgbtn[hidden] { display:none; }
  [data-price] { position:relative; }      /* 收费按钮右上角的价格角标（价格文字在 data-price 里，来自后端；免费 / 计费关闭时没有这个属性） */
  [data-price]::after { content:attr(data-price); position:absolute; right:-6px; top:-8px; padding:1px 6px; border-radius:999px; background:var(--grad); color:#fff; font-size:10px; font-weight:700; line-height:1.5; white-space:nowrap; pointer-events:none; box-shadow:0 2px 6px rgba(124,58,237,.35); }
  .ptag { font-weight:500; opacity:.85; }
  .imgbtn .ci { width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-size:16px; background:var(--card); border:1px solid var(--border); box-shadow:0 6px 18px rgba(0,0,0,.22); }
  .imgbtn .ci[data-price]::after { right:-10px; top:-9px; padding:0 6px; background:var(--card2); border:1px solid var(--brand); color:var(--brand-text, var(--brand)); font-size:10.5px; font-weight:600; line-height:16px; box-shadow:none; }      /* 生成画面 / 视频的价格角标：和圆形图标同一套（深底 + 细描边），不用高亮渐变色块 */
  .imgbtn .ci[data-price]::after { display:none; }      /* 对话里「生成画面 / 视频」按钮上不显示价格：点开后的弹窗里有价格提示 */
  .imgbtn:hover { transform:none; color:var(--fg); }
  .msgend .menu-wrap { display:inline-block; }
  .ctl { box-shadow:0 6px 18px rgba(0,0,0,.18); width:36px; height:36px; padding:0; border-radius:50%; font-size:18px; display:grid; place-items:center; background:var(--card); }
  .ctl[hidden], .vn[hidden] { display:none; } .vn { font-size:12px; color:var(--muted); font-variant-numeric:tabular-nums; }
  .ctl:disabled { opacity:.35; }
  .menu.up { top:auto; bottom:calc(100% + 8px); }
  body.chatpage main { padding:0; max-width:none; }
  body.chatpage .chat { height:100dvh; border-radius:0; border:0; max-width:840px; }
  /* 对话页不许横向撑宽：消息里一段超长内容（链接、代码、表格）会把页面撑得比屏幕宽，输入栏右边的发送按钮就跑到屏幕外 */
  html:has(body.chatpage), body.chatpage { overflow-x:hidden; max-width:100vw; }
  body.chatpage main, body.chatpage .chat, body.chatpage .chat-bottom, body.chatpage .inputbar { min-width:0; max-width:100%; box-sizing:border-box; }
  body.chatpage .chat { width:100%; }
  body.chatpage .msgs { overflow-x:hidden; min-width:0; } body.chatpage .msgs .msg, body.chatpage .msgs .seg { overflow-wrap:anywhere; } body.chatpage .msgs .seg { max-width:100%; }
  @media (min-width:721px) { body.chatpage main { padding:16px; } body.chatpage .chat { height:calc(100dvh - 32px); border-radius:26px; border:1px solid var(--border); } }
  .msgs { flex:1; overflow-y:auto; padding:22px 20px 10px; display:flex; flex-direction:column; gap:16px; scroll-behavior:smooth; }
  .msg { max-width:86%; padding:12px 16px; border-radius:20px; white-space:pre-wrap; word-break:break-word; line-height:1.8; font-size:15.5px; animation:pop .28s ease both; }
  .msg.assistant { align-self:flex-start; background:var(--bubble); border:1px solid var(--border); border-top-left-radius:6px; box-shadow:0 4px 16px rgba(0,0,0,.08); }
  .msg.cont { animation:none; }
  .msg.user { align-self:flex-end; color:#fff; background:var(--grad); border-top-right-radius:6px; box-shadow:0 6px 20px rgba(126,224,200,.35); }
  .msg.user[data-who]:not([data-who=""])::before { content:attr(data-who); display:block; font-size:12px; font-weight:600; opacity:.88; margin:-2px 0 4px; line-height:18px; }
  .msg.user.whoimg::before { padding-left:24px; background:var(--wav) left center / 18px 18px no-repeat; }
  .msg img { display:block; max-width:min(380px,100%); border-radius:14px; cursor:zoom-in; box-shadow:0 8px 24px rgba(0,0,0,.25); }
  @keyframes pop { from { opacity:0; transform:translateY(8px) scale(.98); } to { opacity:1; transform:none; } }
  .act { display:block; color:var(--muted); font-style:italic; font-size:14.5px; margin:1px 0 4px; line-height:1.7; }
  .msg.user .act { color:rgba(255,255,255,.82); }
  .seg { margin:2px 0 12px; }
  .seg:last-child { margin-bottom:0; }
  .who { display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; margin-bottom:3px; letter-spacing:.3px; }
  .who i { font-style:normal; width:24px; height:24px; border-radius:50%; background:var(--card2); display:inline-grid; place-items:center; font-size:13px; overflow:hidden; box-shadow:0 0 0 2px color-mix(in srgb,var(--accent2) 45%,transparent); }
  .who i img { width:100%; height:100%; object-fit:cover; border-radius:0; box-shadow:none; }
  .env { display:flex; gap:8px; margin:8px 2px 10px; color:var(--muted); font-style:italic; font-size:14px; line-height:1.75; }
  .env::before { content:'≡'; font-style:normal; opacity:.6; flex:none; }
  .seg.narr { color:var(--muted); font-style:italic; font-size:14px; padding:8px 12px; border-left:3px solid color-mix(in srgb,var(--accent2) 60%,transparent); background:var(--card2); border-radius:8px; }
  .aff { margin-top:10px; padding:6px 12px; border-radius:14px; font-size:12px; line-height:1.5; font-weight:700; display:block; width:fit-content; max-width:100%; text-align:left; color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,transparent); border:1px solid color-mix(in srgb,var(--accent) 35%,transparent); white-space:normal; }
  .typing { display:inline-flex; gap:5px; vertical-align:middle; margin-right:8px; }
  .typing i { width:7px; height:7px; border-radius:50%; background:var(--accent2); animation:blink 1.2s infinite ease-in-out; }
  .typing i:nth-child(2) { animation-delay:.18s; } .typing i:nth-child(3) { animation-delay:.36s; }
  @keyframes blink { 0%,80%,100% { opacity:.25; transform:scale(.8); } 40% { opacity:1; transform:scale(1.15); } }
  .tt { color:var(--muted); font-size:13px; }
  .inputbar { display:flex; gap:10px; align-items:flex-end; padding:8px 14px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--border); background:var(--bar); backdrop-filter:blur(14px); }
  .inwrap { flex:1; min-width:0; display:flex; align-items:flex-end; gap:4px; padding:4px 6px 4px 4px; border-radius:26px; border:1px solid var(--border); background:var(--card2); transition:border-color .15s, box-shadow .15s; }
  .inwrap { position:relative; }
  .inwrap.preparing { border-color:var(--accent2); background:linear-gradient(100deg,var(--card2) 30%,color-mix(in srgb,var(--accent2) 16%,var(--card2)) 50%,var(--card2) 70%) 0 0/220% 100%; animation:prepsh 1.5s linear infinite; }
  @keyframes prepsh { to { background-position:-220% 0; } }
  .inwrap .prep { display:none; position:absolute; top:50%; transform:translateY(-50%); align-items:center; gap:5px; color:var(--accent2); font-size:14.5px; pointer-events:none; }
  .inwrap .prep i { width:6px; height:6px; border-radius:50%; background:var(--accent2); animation:vptyp 1.1s infinite; } .inwrap .prep i:nth-child(2) { animation-delay:.18s; } .inwrap .prep i:nth-child(3) { animation-delay:.36s; } .inwrap .prep b { font-weight:500; margin-left:4px; }
  .inwrap.preparing textarea:placeholder-shown ~ .prep { display:flex; }
  .inwrap:focus-within { border-color:var(--accent2); box-shadow:0 0 0 3px color-mix(in srgb,var(--accent2) 24%,transparent); }
  .inwrap textarea { flex:1; min-width:0; resize:none; height:40px; max-height:140px; padding:9px 6px; border:0 !important; box-shadow:none !important; background:transparent; border-radius:0; line-height:22px; overflow-y:auto; }
  .freebtn { display:flex; align-items:center; gap:3px; height:40px; padding:0 10px 0 8px; border:0; border-radius:20px; background:color-mix(in srgb,var(--accent2) 14%,transparent); font-size:13px; flex:none; }
  .freebtn span { font-size:16px; } .freebtn b { font-size:12px; color:var(--accent2); }
  .inputbar > button { width:48px; height:48px; padding:0; border-radius:50%; font-size:18px; flex:none; }
  .sugg { padding:8px 14px 0; display:flex; flex-direction:column; gap:8px; max-height:42vh; overflow-y:auto; } .sugg[hidden] { display:none; }
  .sg-head { display:flex; justify-content:space-between; align-items:center; font-size:12px; color:var(--muted); } .sg-head button { width:30px; height:30px; padding:0; border-radius:50%; margin-left:6px; }
  .sugg > div:not(.sg-head):not(.sg-kw) { display:flex; flex-direction:column; gap:8px; }
  .sugg > * { flex:none; } .sugg > div:not(.sg-head):not(.sg-kw) > * { flex:none; }      /* 窗口矮 / 窄时，候选句不被压扁、叠在一起：保持各自的高度，超出就在 .sugg 里滚动 */
  .sg-item { text-align:left; padding:10px 14px; border-radius:16px; line-height:1.55; font-size:14.5px; background:var(--card); }
  .sg-item:hover { border-color:var(--accent2); }
  .menu-wrap { position:relative; }
  .menu { position:absolute; right:0; top:calc(100% + 8px); background:var(--bg); border:1px solid var(--border); border-radius:16px; padding:6px; min-width:210px; z-index:20; box-shadow:0 14px 40px rgba(0,0,0,.35); }
  .menu[hidden] { display:none; }
  .menu button { display:block; width:100%; text-align:left; background:none; border:0; padding:9px 12px; border-radius:10px; }
  .menu button:hover { background:var(--card2); transform:none; }
  .menu small { display:block; color:var(--muted); font-size:12px; }

  /* ---------- list / rows / dialogs ---------- */
  .list-item { display:flex; gap:14px; align-items:center; padding:14px 16px; border-radius:18px; background:var(--card); border:1px solid var(--border); margin-bottom:12px; cursor:pointer; box-shadow:var(--shadow); transition:transform .18s, border-color .18s; }
  .list-item:hover { transform:translateY(-2px); border-color:color-mix(in srgb,var(--accent2) 55%,transparent); }
  .list-item .avatar { width:52px; height:52px; font-size:26px; }
  .list-item .last { color:var(--muted); font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:min(560px,58vw); }
  .row { display:flex; gap:10px; align-items:flex-start; padding:14px 16px; border-radius:16px; background:var(--card); border:1px solid var(--border); margin-bottom:10px; }
  .row .body { flex:1; min-width:0; }
  .row .body p { margin:4px 0 0; color:var(--muted); font-size:13px; white-space:pre-wrap; }
  .row button { padding:5px 12px; font-size:13px; }
  .badge { white-space:nowrap; font-size:11px; padding:2px 9px; border-radius:999px; background:var(--grad); color:#fff; margin-left:6px; font-weight:700; }
  h2.sec { margin:36px 0 4px; }
  .opt { display:flex; gap:12px; align-items:flex-start; padding:12px 14px; border-radius:14px; background:var(--card2); border:1px solid var(--border); margin-bottom:8px; cursor:pointer; }
  .opt input { width:auto; margin-top:5px; }
  dialog { border:1px solid var(--border); border-radius:22px; background:var(--bg); color:var(--fg); padding:24px; max-width:440px; width:90vw; box-shadow:0 30px 80px rgba(0,0,0,.5); }
  dialog::backdrop { background:rgba(8,6,16,.6); backdrop-filter:blur(4px); }
  .auth { max-width:400px; margin:6vh auto 0; padding:34px 30px 28px; border-radius:26px; background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); }
  .gbtn { display:flex; align-items:center; justify-content:center; gap:10px; width:100%; box-sizing:border-box; padding:11px 14px; margin:4px 0 2px;
    border-radius:14px; border:1px solid var(--border); background:var(--card); color:inherit; text-decoration:none; font-weight:600; }
  .gbtn:hover { border-color:currentColor; }
  .gbtn.abtn { background:#000; color:#fff; border-color:#000; margin-top:10px; }      /* 通过 Apple 登录：苹果规范要求黑底（或白底黑字） */
  .gbtn.abtn:hover { background:#1a1a1a; }
  .auth .or { display:flex; align-items:center; gap:10px; margin:14px 0 4px; color:var(--muted, #888); font-size:12px; }
  .auth .or::before, .auth .or::after { content:""; flex:1; border-top:1px solid var(--border); }
  .coderow { display:flex; gap:8px; } .coderow input { flex:1; min-width:0; } .coderow button { white-space:nowrap; flex:none; }
  .auth .brand { text-align:center; margin-bottom:6px; }
  .auth .brand .logo { font-size:34px; }
  .auth h2 { text-align:center; margin-top:14px; }

  .toolbar button.on { background:var(--grad); color:#fff; border-color:transparent; }
  .mine-item { display:flex; gap:12px; align-items:center; padding:12px 14px; border-radius:16px; background:var(--card); border:1px solid var(--border); margin-bottom:10px; cursor:pointer; transition:transform .15s, border-color .15s; }
  .mine-item:hover { transform:translateY(-2px); border-color:var(--accent2); }
  .mine-item .ico img { width:100%; height:100%; object-fit:cover; }
  .mine-item .ico { width:46px; height:46px; border-radius:14px; display:grid; place-items:center; font-size:24px; flex:none; background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .mine-item .macts { display:flex; gap:6px; flex:none; } .mine-item .macts button { width:38px; height:38px; padding:0; border-radius:50%; font-size:16px; display:grid; place-items:center; }
  .mine-item b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mine-item small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .mine-item small { display:block; color:var(--muted); font-size:12px; }
  /* ---------- 背景介绍 / 小说体 ---------- */
  .nar { color:var(--muted); font-style:italic; }
  .say { color:var(--fg); font-style:normal; }
  .msg.user .nar { color:rgba(255,255,255,.82); } .msg.user .say { color:#fff; }
  .intro-text { white-space:pre-wrap; line-height:1.8; font-size:14.5px; }
  .intro-text .ih { display:block; width:fit-content; margin:12px 0 4px; padding:1px 10px; border-radius:999px; font-size:12px; font-weight:700; color:#fff; background:var(--grad); }
  .intro-text .ih:first-child { margin-top:0; }
  .vcard { align-self:stretch; flex:none; position:relative; display:flex; align-items:center; gap:12px; margin:10px 0; padding:12px 14px; border:1px solid var(--border); border-radius:18px; background:color-mix(in srgb,var(--card2) 80%,transparent); }
  .vcard.vpend { flex-direction:column; justify-content:center; align-self:flex-start; width:min(560px,100%); aspect-ratio:16/9; padding:20px; border-radius:20px; text-align:center; gap:14px; background:var(--card); }      /* 生成中：和生成画面一样，先占一张和成品同样大小的卡片（16:9），不是一条细条 */
  .vcard.vpend .spin { width:38px; height:38px; }
  .vcard video { width:100%; max-height:70vh; border-radius:14px; background:#000; display:block; }
  .vcard .vt { flex:1; min-width:0; } .vcard .vt p { margin:4px 0 0; font-size:12.5px; color:var(--muted); }
  .vcard .spin { width:26px; height:26px; flex:none; border:3px solid var(--border); border-top-color:var(--accent); border-radius:50%; animation:vspin 1s linear infinite; }
  @keyframes vspin { to { transform:rotate(360deg); } }
  .vcard .vx { position:absolute; top:8px; right:8px; padding:2px 8px; border-radius:999px; font-size:12px; opacity:.8; }
  .vcard.vfail { border-color:var(--accent); }
  .idv { align-self:stretch; flex:none; display:flex; align-items:center; gap:12px; margin:14px 0; color:var(--muted); font-size:14px; }
  .idv::before, .idv::after { content:""; flex:1; height:1px; background:var(--border); }
  .idv b { color:var(--fg); font-weight:600; }
  .rolepick { align-self:stretch; flex:none; border:1px solid var(--border); border-radius:18px; background:color-mix(in srgb,var(--card2) 80%,transparent); padding:12px 14px; display:flex; flex-direction:column; gap:8px; }
  .rolepick .rp-h { font-weight:700; color:var(--accent); }
  .rolepick .rp-sub { font-size:12px; color:var(--muted); margin-top:-4px; }
  .rolepick .rp-opt { display:flex; align-items:center; gap:10px; text-align:left; padding:10px 12px; border-radius:14px; background:var(--card); border:1px solid var(--border); cursor:pointer; color:inherit; }
  .rolepick .rp-opt.on { border-color:var(--accent); }
  .rolepick .rp-t { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
  .rolepick .rp-t small { color:var(--muted); font-size:12.5px; }
  .rolepick .rp-t em { font-style:normal; font-size:11px; margin-left:6px; padding:0 6px; border-radius:999px; background:var(--card2); }
  .rolepick .rp-opt i { font-style:normal; color:var(--accent); font-weight:700; }
  details.intro { align-self:stretch; flex:none; border:1px solid var(--border); border-radius:18px; background:color-mix(in srgb,var(--card2) 80%,transparent); padding:12px 18px; }
  details.intro summary { display:flex; align-items:center; gap:10px; cursor:pointer; font-weight:700; color:var(--accent); list-style:none; }
  details.intro summary::-webkit-details-marker { display:none; }
  details.intro summary::after { content:"▾"; margin-left:auto; color:var(--muted); transition:transform .2s; }
  details.intro:not([open]) summary::after { transform:rotate(-90deg); }
  details.intro summary small { flex:1; min-width:0; font-weight:500; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  details.intro[open] summary small { display:none; }
  details.intro[open] summary { margin-bottom:8px; }
  .pdlg { padding:0; overflow:hidden; max-width:560px; }
  .pdlg .pcover { height:120px; display:grid; place-items:center; font-size:56px; position:relative; background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  .pdlg .pcover span { filter:drop-shadow(0 6px 10px rgba(0,0,0,.35)); }
  .pdlg .pbody2 { padding:18px 22px 22px; max-height:56vh; overflow:auto; }
  .pdlg h3 { margin:0 0 6px; font-size:20px; }
  .pdlg .pact { display:flex; gap:10px; justify-content:flex-end; padding:14px 22px; border-top:1px solid var(--border); background:var(--card); }
  .cardlist { display:flex; flex-direction:column; gap:8px; margin-top:14px; }
  .crow { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border-radius:14px; background:var(--card); border:1px solid var(--border); }
  .crow .avatar { width:38px; height:38px; font-size:19px; }
  .crow p { margin:2px 0 0; font-size:13px; color:var(--muted); line-height:1.55; }
  .pdlg .cast { margin:12px 0 6px; flex-wrap:wrap; }
  .pdlg .cast .avatar { width:34px; height:34px; font-size:17px; }
  /* ---------- AI 创作向导 ---------- */
  .wiz { position:fixed; inset:0; z-index:90; display:flex; justify-content:center; background:radial-gradient(900px 520px at 12% -8%,var(--glow1),transparent 62%),radial-gradient(800px 520px at 92% -4%,var(--glow2),transparent 62%),var(--bg); }
  .wiz-in { width:100%; max-width:680px; display:flex; flex-direction:column; height:100dvh; }
  .wiz-top { display:flex; align-items:center; gap:10px; padding:14px 16px 6px; }
  .wiz-top .x { width:38px; height:38px; padding:0; border-radius:50%; font-size:18px; flex:none; }
  .dots { flex:1; display:flex; align-items:center; justify-content:center; gap:0; overflow:hidden; }
  .dot { flex:none; min-width:22px; height:22px; border-radius:999px; border:2px solid var(--border); display:grid; place-items:center; font-size:12px; color:var(--muted); }
  .dot.done { background:var(--card2); border-color:transparent; cursor:pointer; color:var(--fg); }
  .dot.cur { background:var(--grad); border-color:transparent; color:#fff; font-weight:700; padding:0 12px; height:28px; box-shadow:0 4px 14px rgba(126,224,200,.4); }
  .dl { flex:none; width:12px; height:2px; background:var(--border); }
  .wiz-body { flex:1; overflow-y:auto; padding:6px 18px 24px; }
  .wiz-foot { display:flex; gap:10px; padding:12px 18px calc(14px + env(safe-area-inset-bottom)); border-top:1px solid var(--border); background:var(--bar); backdrop-filter:blur(14px); }
  .wiz-foot button { flex:1; height:48px; border-radius:14px; font-weight:600; }
  .bubble { position:relative; width:fit-content; max-width:92%; margin:10px auto 14px; padding:12px 18px; border-radius:18px; background:var(--card2); border:1px solid var(--border); text-align:center; font-weight:600; font-size:16px; line-height:1.55; }
  .bubble::after { content:""; position:absolute; left:50%; bottom:-8px; width:14px; height:14px; margin-left:-7px; transform:rotate(45deg); background:var(--card2); border-right:1px solid var(--border); border-bottom:1px solid var(--border); }
  .blob { position:relative; width:74px; height:60px; margin:0 auto 18px; border-radius:50% 50% 46% 46%/62% 62% 38% 38%; background:radial-gradient(circle at 35% 28%,#c9f0ff 0 14%,#a98bff 46%,#7d4dff 100%); box-shadow:inset 0 -6px 12px rgba(80,30,200,.35),0 10px 24px rgba(125,77,255,.35); animation:wob 3.2s ease-in-out infinite; }
  .blob i { position:absolute; top:26px; width:6px; height:6px; border-radius:50%; background:#241a4d; } .blob i:nth-child(1) { left:23px; } .blob i:nth-child(2) { right:23px; }
  .blob b { position:absolute; left:50%; top:36px; width:12px; height:6px; margin-left:-6px; border-bottom:2px solid #241a4d; border-radius:0 0 10px 10px; }
  .blob.think { animation:wob .9s ease-in-out infinite; }
  @keyframes wob { 0%,100% { transform:translateY(0) scale(1,1); } 50% { transform:translateY(-6px) scale(1.04,.96); } }
  .wlist { display:flex; flex-direction:column; gap:10px; }
  .wopt, .wcard { display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:18px; background:var(--card); border:1px solid var(--border); cursor:pointer; }
  .wopt small { display:block; color:var(--muted); font-size:13px; margin-top:2px; }
  .wopt input { width:20px; height:20px; margin-top:2px; flex:none; }
  .wcard.sel { border-color:var(--accent2); background:color-mix(in srgb,var(--accent2) 12%,var(--card)); }
  .wcard .radio { width:20px; height:20px; border-radius:50%; border:2px solid var(--muted); flex:none; margin-top:2px; position:relative; }
  .wcard.sel .radio { border-color:var(--accent2); } .wcard.sel .radio::after { content:""; position:absolute; inset:3px; border-radius:50%; background:var(--accent2); }
  .wc-main { flex:1; min-width:0; } .wc-main b { display:block; font-size:16px; } .wc-main p { margin:3px 0 0; color:var(--muted); font-size:14px; line-height:1.6; }
  .wc-main input, .wc-main textarea { margin-top:6px; font-size:14px; }
  .pen { width:34px; height:34px; padding:0; border-radius:10px; flex:none; background:none; border:0; color:var(--muted); font-size:16px; }
  .wadd { width:100%; padding:12px; border-radius:14px; background:var(--card2); border:1px solid var(--border); font-weight:600; }
  .wform { background:var(--card); border:1px solid var(--border); border-radius:18px; padding:4px 16px 16px; margin-bottom:14px; }
  .wform h4 { margin:14px 0 0; font-size:15px; display:flex; align-items:center; gap:8px; }
  .wform h4 .del { margin-left:auto; padding:2px 8px; font-size:13px; }
  .wform label { font-size:12px; margin:12px 0 4px; }
  .wform textarea { font-size:14px; }
  .chipsel { display:flex; gap:8px; overflow-x:auto; padding:2px 0 8px; }
  .chipsel .sc { flex:none; display:flex; flex-direction:column; align-items:center; gap:2px; width:78px; padding:10px 6px; border-radius:16px; background:var(--card); border:2px solid var(--border); cursor:pointer; font-size:13px; }
  .chipsel .sc.pic { width:104px; padding:6px 6px 8px; gap:6px; } .chipsel .sc.pic img { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:10px; display:block; background:var(--card2); }      /* 画风示意图 */
  .chipsel .sc i { font-style:normal; font-size:26px; } .chipsel .sc.sel { border-color:var(--accent2); background:color-mix(in srgb,var(--accent2) 14%,var(--card)); font-weight:700; }
  .prow { display:flex; gap:12px; align-items:flex-start; padding:12px; border-radius:16px; background:var(--card); border:1px solid var(--border); margin-bottom:10px; }
  .prow .th { width:84px; height:112px; border-radius:12px; background:var(--card2); display:grid; place-items:center; flex:none; overflow:hidden; font-size:30px; color:var(--muted); }
  .prow .th img { width:100%; height:100%; object-fit:cover; }
  .prow textarea { font-size:13px; } .prow .nm { font-weight:700; margin-bottom:4px; }
  .choose { display:grid; gap:12px; margin-top:6px; }
  .choose .cc { padding:18px; border-radius:20px; background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); }
  .choose .cc h3 { margin:0 0 4px; } .choose .cc p { margin:0 0 12px; color:var(--muted); font-size:14px; }
  /* ---------- 系统管理 ---------- */
  main.wide { max-width:1320px; }
  .admin { display:grid; grid-template-columns:330px minmax(0,1fr); gap:22px; align-items:start; }
  .acol { position:sticky; top:calc(var(--hh) + 16px); }
  .acol select { margin-bottom:4px; }
  .alist { display:flex; flex-direction:column; gap:6px; max-height:calc(100dvh - 330px); min-height:160px; overflow:auto; margin-top:12px; padding-right:4px; }
  .aitem { display:flex; gap:10px; align-items:center; padding:10px 12px; border-radius:14px; background:var(--card); border:1px solid var(--border); cursor:pointer; transition:border-color .15s, background .15s; }
  .aitem:hover { border-color:color-mix(in srgb,var(--accent2) 50%,transparent); }
  .aitem.sel { border-color:var(--accent2); background:color-mix(in srgb,var(--accent2) 14%,var(--card)); }
  .aitem .ico { font-size:24px; width:36px; height:36px; text-align:center; flex:none; overflow:hidden; border-radius:10px; display:grid; place-items:center; }
  .aitem .ico img { width:100%; height:100%; object-fit:cover; display:block; }
  .aitem b { display:block; font-size:14px; line-height:1.3; }
  .aitem small { display:block; color:var(--muted); font-size:12px; }
  #aed { background:var(--card); border:1px solid var(--border); border-radius:22px; padding:22px 26px 28px; box-shadow:var(--shadow); min-width:0; }
  #aed h2 small { font-size:13px; font-weight:500; }
  #aed textarea { font-size:14px; line-height:1.6; }
  #aed .lock { display:inline-block; font-size:12px; font-weight:700; padding:2px 10px; border-radius:999px; color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,transparent); margin-left:8px; }
  .two { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
  .xcs { display:flex; flex-wrap:wrap; gap:8px 16px; }
  .xcs label { display:flex; gap:6px; align-items:center; margin:0; color:var(--fg); font-weight:500; }
  .xcs input { width:auto; }
  .newbar { display:flex; gap:10px; flex-wrap:wrap; margin-bottom:6px; }
  .profbtns { flex:1 0 100%; display:flex; gap:10px; margin-top:8px; } .profbtns button { flex:1; padding:11px; font-weight:600; }
  .actrows { display:flex; flex-direction:column; gap:8px; margin:14px 0 4px; }
  .ptchip { display:inline-flex; align-items:center; gap:4px; padding:5px 11px; border-radius:999px; font-size:13px; font-weight:700; margin-right:6px; }
  dialog.udlg.edlg { width:min(1100px,96vw); max-height:92vh; padding:20px 26px 28px; box-sizing:border-box; }      /* 编辑器自己的 #aed 被压平成无内边距（见文件后面），间距放在弹窗上；底部保存栏的负边距正好抵消这里的内边距 */
  dialog.edlg #aed { border:0; border-radius:0; box-shadow:none; background:transparent; }
  .edlg-top { display:flex; justify-content:flex-end; margin:-6px 0 6px; }
  .ptbl td, .ptbl th { vertical-align:middle; } .ptbl tbody tr { cursor:pointer; } .ptbl tbody tr:hover { background:color-mix(in srgb,var(--accent) 6%,var(--card)); }
  .ptico { width:40px; height:40px; border-radius:10px; overflow:hidden; display:grid; place-items:center; font-size:22px; background:var(--card2); } .ptico img { width:100%; height:100%; object-fit:cover; display:block; }
  .ubal { padding:4px 12px; border-radius:999px; font-weight:700; font-size:13px; background:color-mix(in srgb,var(--accent) 12%,var(--card)); color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 35%,transparent); }
  .stbl td.acts { white-space:nowrap; text-align:right; } .stbl td.acts button { margin-left:6px; white-space:nowrap; } .stbl td, .stbl th { vertical-align:middle; }
  .mtable td, .mtable th { vertical-align:middle; } .mtable td.nw { white-space:nowrap; } .mtable td.cc { min-width:180px; max-width:420px; white-space:normal; word-break:break-word; line-height:1.55; }
  .mtable td.acts { white-space:nowrap; text-align:right; } .mtable td.acts button { margin-left:6px; }
  .mthumb { width:52px; height:52px; object-fit:cover; border-radius:8px; display:block; }
  .mpre { white-space:pre-wrap; word-break:break-all; font-size:12.5px; line-height:1.6; margin:0; padding:12px 14px; border-radius:12px; background:var(--card2); max-height:60vh; overflow:auto; }
  .pt-head { display:flex; align-items:center; gap:10px; margin-bottom:16px; } .pt-head h3 { margin:0; flex:1; font-size:18px; }
  .pt-tiles { display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:10px; margin-bottom:6px; }
  .pt-tiles > div { display:flex; flex-direction:column; gap:4px; padding:12px 14px; border-radius:14px; background:var(--card2); border:1px solid var(--border); }
  .pt-tiles span { font-size:12px; color:var(--muted); } .pt-tiles b { font-size:22px; line-height:1.2; } .pt-tiles b em { font-style:normal; font-size:13px; font-weight:500; color:var(--muted); margin-left:4px; }
  .pt-tiles .pt-main { background:color-mix(in srgb,var(--accent) 10%,var(--card2)); } .pt-tiles .pt-main b { font-size:28px; } .pt-tiles .pt-date { font-size:16px; padding-top:5px; }
  .pt-h { margin:20px 0 8px; font-size:14px; } .pt-h small { font-weight:400; margin-left:6px; }
  .ptable th, .ptable td { white-space:nowrap; } .ptable .r { text-align:right; } .ptable td.nw { white-space:nowrap; }
  @media (max-width:560px) { .pt-tiles { grid-template-columns:1fr 1fr; } }
  .pt-sum { display:flex; gap:22px; align-items:flex-end; flex-wrap:wrap; padding:12px 16px; border-radius:14px; background:var(--card2); }
  .pt-sum > div { display:flex; flex-direction:column; } .pt-sum b { font-size:22px; line-height:1.2; } .pt-sum .primary { margin-left:auto; }
  .otable td, .otable th { vertical-align:middle; }
  .utwrap { overflow-x:auto; border-radius:14px; }
  dialog.udlg { width:min(780px,94vw); max-width:94vw; box-sizing:border-box; max-height:88vh; padding:0; border:1px solid var(--border); border-radius:20px; background:var(--card); color:var(--fg); overflow:auto; }
  dialog.udlg::backdrop { background:rgba(20,16,32,.45); backdrop-filter:blur(3px); }
  dialog.udlg .udbody { padding:20px 22px 22px; }
  .utable tbody tr { cursor:pointer; } .utable tbody tr:hover { background:color-mix(in srgb,var(--accent) 6%,var(--card)); }
  .utable tbody tr.sel { background:color-mix(in srgb,var(--accent) 12%,var(--card)); box-shadow:inset 3px 0 0 var(--accent); }
  .utable td, .utable th { vertical-align:middle; } .utable td small { font-size:12px; } .utc-mail { max-width:220px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .pr-grid { display:grid; grid-template-columns:minmax(260px,340px) minmax(0,1fr); gap:16px; align-items:start; }
  .pr-list { position:sticky; top:calc(var(--hh) + 16px); max-height:calc(100vh - var(--hh) - 40px); overflow:auto; }
  .pr-g { margin:14px 0 6px; font-size:13px; color:var(--muted); letter-spacing:.04em; } .pr-g:first-child { margin-top:0; }
  .pr-item { display:flex; flex-direction:column; align-items:flex-start; gap:2px; width:100%; margin-bottom:6px; padding:10px 14px; border-radius:14px; text-align:left; background:var(--card); border:1px solid var(--border); color:var(--fg); position:relative; }
  .pr-item:hover { transform:none; } .pr-item.sel { border-color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,var(--card)); }
  .pr-item small { color:var(--muted); font-size:12px; } .pr-mod { position:absolute; right:12px; top:10px; font-style:normal; font-size:11px; padding:1px 8px; border-radius:999px; background:var(--grad); color:#fff; }
  .pr-ta { width:100%; box-sizing:border-box; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; line-height:1.7; }
  .prtbl td, .prtbl th { vertical-align:middle; } .prtbl tbody tr { cursor:pointer; } .prtbl tbody tr:hover { background:color-mix(in srgb,var(--accent) 6%,var(--card)); } .prtbl code { font-size:12px; }
  .pr-ed textarea { width:100%; font-family:ui-monospace,SFMono-Regular,Menlo,monospace; font-size:13px; line-height:1.7; }
  .pr-vars { display:flex; gap:6px; flex-wrap:wrap; align-items:center; margin-bottom:8px; } .pr-var { padding:3px 10px; border-radius:8px; font-family:ui-monospace,Menlo,monospace; font-size:12.5px; }
  .pr-bar { display:flex; gap:8px; align-items:center; margin-top:10px; } .pr-bar .muted { margin-right:auto; }
  .pr-hist { display:flex; justify-content:space-between; gap:8px; align-items:center; padding:6px 0; border-bottom:1px solid var(--border); font-size:13px; }
  @media (max-width:900px) { .pr-grid { grid-template-columns:1fr; } .pr-list { position:static; max-height:260px; } }
  .whobtn.guest { background:var(--grad); color:#fff; border:0; border-radius:999px; padding:8px 20px; font-weight:700; box-shadow:0 4px 14px rgba(126,224,200,.35); }
  .whobtn.guest #loginbtn { color:#fff; }
  .nsfw-wrap { position:relative; overflow:hidden; }
  .nsfw-wrap img, .nsfw-wrap .cv-strip, .nsfw-wrap > span { filter:blur(26px) brightness(.85); transform:scale(1.08); pointer-events:none; }
  .nsfw-veil { position:absolute; inset:0; z-index:5; display:flex; align-items:center; justify-content:center; background:rgba(20,16,32,.35); }
  .nsfw-veil button { padding:8px 22px; border-radius:999px; font-weight:700; font-size:14px; line-height:1.2; border:1px solid rgba(255,255,255,.7); background:rgba(255,255,255,.22); color:#fff; backdrop-filter:blur(4px); }
  .flag.nsfw { background:var(--danger); color:#fff; }
  /* 运营后台导航：一级（分类）是带下划线的文字页签，二级（分类里的页面）是小号文字按钮；所有后台页面共用 main.wide 的宽度，左右边缘对齐 */
  .adnav { margin:0 0 20px; display:flex; flex-direction:column; }
  .adgroups { display:flex; gap:2px; flex-wrap:wrap; border-bottom:1px solid var(--border); }
  .adgroups button { display:flex; align-items:center; gap:7px; padding:12px 18px; margin:0 0 -1px; border:0; border-bottom:3px solid transparent; border-radius:0; background:none; box-shadow:none; font-size:15px; font-weight:600; color:var(--muted); }
  .adgroups button:hover { transform:none; color:var(--fg); background:none; }
  .adgroups button.active { color:var(--accent); border-bottom-color:var(--accent); background:none; box-shadow:none; font-weight:700; }
  .adsub { display:flex; gap:6px; flex-wrap:wrap; padding:12px 0 0; }
  .adsub button { padding:5px 14px; border-radius:999px; font-size:13.5px; border:1px solid transparent; background:none; box-shadow:none; color:var(--muted); }
  .adsub button:hover { transform:none; color:var(--fg); }
  .adsub button.active { color:var(--accent); border-color:color-mix(in srgb,var(--accent) 40%,transparent); background:color-mix(in srgb,var(--accent) 10%,transparent); font-weight:700; }
  .adsub .cnt { margin-left:4px; font-size:12px; opacity:.7; }
  .opswrap, .admpage { width:100%; } .opshead { display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin-bottom:14px; } .opsnav { display:flex; gap:6px; flex-wrap:wrap; }
  .opsnav button.active { background:var(--grad); color:#fff; border-color:transparent; } .tabs .cnt { margin-left:4px; font-size:12px; opacity:.7; }
  .optable { width:100%; border-collapse:collapse; font-size:13.5px; background:var(--card); border-radius:14px; overflow:hidden; } .optable th, .optable td { padding:8px 10px; border-bottom:1px solid var(--border); text-align:left; vertical-align:top; }
  .optable th { font-size:12px; color:var(--muted); font-weight:600; } .optable button { padding:4px 10px; font-size:12.5px; }
  .batchbar { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:8px 0 12px; position:sticky; top:64px; background:var(--bg, #fff); padding:8px 0; z-index:5; }
  .brow { display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--border); border-radius:14px; margin-bottom:8px; background:var(--card); cursor:pointer; font-weight:400; }
  .brow .ico { width:40px; height:40px; border-radius:10px; overflow:hidden; display:flex; align-items:center; justify-content:center; font-size:22px; flex:none; } .brow .ico img { width:100%; height:100%; object-fit:cover; }
  .tp .tg.gen { background:color-mix(in srgb, var(--accent) 18%, transparent); }
  .two3 { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; } .kpis { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; margin-bottom:10px; }
  .kpi { background:var(--card); border:1px solid var(--border); border-radius:14px; padding:12px 14px; } .kpi small { color:var(--muted); display:block; } .kpi b { font-size:24px; }
  .acol .tabs { flex-wrap:wrap; }
  .opswrap .toolbar select { width:auto; flex:none; } .opswrap .toolbar { align-items:center; } .opswrap .toolbar label { font-weight:400; flex:none; }
  dialog .two > div, dialog .two3 > * { min-width:0; } dialog .two input, dialog .two select { width:100%; box-sizing:border-box; }
  .chip { padding:5px 11px; border-radius:999px; font-size:13px; } .chip.on { background:var(--grad); color:#fff; border-color:transparent; }
  .tp { display:flex; flex-wrap:wrap; gap:6px; align-items:center; } .tp .tg { display:inline-flex; align-items:center; gap:4px; padding:5px 6px 5px 11px; border-radius:999px; background:var(--chip, rgba(126,224,200,.12)); font-size:13px; }
  .tp .tg.cand { border:1px dashed var(--muted); } .tp .tg button { padding:0 6px; border:0; background:none; box-shadow:none; font-size:12px; }
  .tp .tpadd, .tp .tpai { padding:5px 12px; border-radius:999px; font-size:13px; } .tpin { width:210px; padding:5px 12px; border-radius:999px; font-size:13px; } .tphint { color:#e5484d; display:block; margin-top:4px; }
  .tagdlg { width:min(560px, 94vw); } .tdbody { max-height:52vh; overflow:auto; margin-top:10px; } .tdgrp { margin-bottom:12px; } .tdgrp > div { display:flex; flex-wrap:wrap; gap:6px; margin-top:6px; }
  .stylebox { margin:14px 0; padding:10px 14px; border:1px solid var(--border); border-radius:14px; } .stylebox summary { cursor:pointer; font-weight:600; }
  .stylegrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:4px 12px; margin-top:8px; }
  .sg-kw { display:flex; flex-wrap:wrap; gap:6px; } .sg-item.kw { width:auto; border-radius:999px; padding:7px 14px; }
  .grid.hrow { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:calc((100% - 40px) / 3); overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; }
  .grid.hrow > * { scroll-snap-align:start; }
  @media (max-width: 720px) { .grid.hrow { grid-auto-columns:46%; } }
  .linkbtn { background:none; border:0; box-shadow:none; color:var(--accent); padding:2px 4px; font-weight:600; cursor:pointer; }
  .wallet { max-width:860px; margin:0 auto; }
  .wl-card { background:var(--card); border:1px solid var(--border); border-radius:20px; padding:18px 20px; margin-bottom:14px; box-shadow:var(--shadow); }
  .wbal { font-size:40px; font-weight:800; line-height:1.1; }
  .wgrid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; }
  .wpack { display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:14px; border-radius:16px; text-align:left; }
  .wpack b { font-size:20px; } .wpack em { font-style:normal; font-size:12px; color:var(--accent); font-weight:700; }
  .wrow { display:flex; justify-content:space-between; gap:10px; padding:8px 0; border-bottom:1px solid var(--border); font-size:14px; }
  .wrow:last-child { border-bottom:0; } .wplus { color:#1f9d55; font-weight:700; } .wminus { font-weight:700; }
  .wtest { background:#fff4d6; color:#7a5b00; border-radius:12px; padding:8px 12px; font-size:13px; margin-bottom:12px; }
  .actrows .unread { margin-left:auto; margin-right:8px; min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--danger); color:#fff; font-size:11px; font-weight:700; display:grid; place-items:center; }      /* 「我的」页：通知的未读数 */
  .actrows button { display:flex; justify-content:space-between; align-items:center; text-align:left; padding:14px 16px; border-radius:14px; font-weight:600; }
  .mehead .cav img { width:100%; height:100%; object-fit:cover; border-radius:50%; } .mehead .cav { overflow:hidden; } dialog .cav { width:64px; height:64px; border-radius:50%; overflow:hidden; display:grid; place-items:center; font-size:28px; font-weight:800; color:#fff; flex:none; background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); } dialog .cav img { width:100%; height:100%; object-fit:cover; }
  .mehead { display:flex; align-items:center; gap:14px; padding:16px 18px; border-radius:20px; background:var(--card); border:1px solid var(--border); box-shadow:var(--shadow); }
  .mehead .cav { width:56px; height:56px; border-radius:50%; display:grid; place-items:center; font-size:24px; font-weight:800; color:#fff; flex:none;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); }
  h2.sec small { font-size:14px; font-weight:500; }
  .rolebox { display:flex; gap:14px; padding:12px; margin:8px 0; border:1px solid var(--border); border-radius:16px; background:var(--card); }
  .rolebox .rb-av { display:flex; flex-direction:column; gap:6px; align-items:stretch; width:104px; flex:none; text-align:center; }
  .rolebox .rb-av .avatar { align-self:center; }
  .rolebox .rb-av button { padding:4px 6px; font-size:12px; } .rolebox .rb-av select { padding:4px 26px 4px 10px; font-size:12px; background-position:right 9px center; }
  .rolebox .rb-main { flex:1; min-width:0; }
  .coverbox { display:flex; gap:16px; align-items:flex-start; }
  .cvprev { width:120px; aspect-ratio:3/4; flex:none; border-radius:14px; overflow:hidden; display:grid; place-items:center; font-size:48px; color:#fff;
    background:linear-gradient(135deg,hsl(var(--h,200) 78% 55%),hsl(calc(var(--h,200) + 48) 72% 36%)); }
  .cvprev img { width:100%; height:100%; object-fit:cover; }
  select[title="画风"] { padding:6px 28px 6px 10px; font-size:13px; appearance:none; -webkit-appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237d7d99' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; background-size:12px; }
  .cvact { display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; align-items:center; }
  .cvact button, .cvact select { height:40px; box-sizing:border-box; padding:0 14px; font-size:14px; line-height:1; }
  .cvact select { width:auto; padding-right:34px; appearance:none; -webkit-appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237d7d99' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 13px center; background-size:12px; }
  .savebar { position:sticky; bottom:0; display:flex; gap:10px; align-items:center; margin:22px -26px -28px; padding:14px 26px; border-top:1px solid var(--border); background:var(--bar); backdrop-filter:blur(14px); border-radius:0 0 22px 22px; }
  .savebar { flex-wrap:wrap; }      /* 窄屏：放不下就换行，标签和按钮不竖排、不被压扁 */
  .savebar label { white-space:nowrap; }
  .savebar select { min-width:0; flex:1 1 160px; }
  .savebar button { flex:none; white-space:nowrap; }
  @media (max-width:560px) { .rolebox { flex-direction:column; } .rolebox .rb-av { width:auto; flex-direction:row; flex-wrap:wrap; align-items:center; } .coverbox { flex-direction:column; } }
  body.immersive header { display:none; }
  @media (max-width:700px) { body.imm-m header { display:none; } }      /* 手机上：子页面（有自己返回按钮的）不显示顶部栏 */
  @media (max-width:700px) { body.notop-m header { height:0; padding:0; background:none; border:0; box-shadow:none; } body.notop-m header .logo, body.notop-m header .langbox, body.notop-m header .userbox { display:none; } }      /* 手机上发现 / 创建 / 对话 / 我的页：只藏顶部栏的内容，底部导航（也在 header 里）保留 */
  .pp { max-width:1000px; margin:0 auto; padding-bottom:96px; }
  .pp-cover { position:relative; aspect-ratio:3/4; max-height:76vh; width:100%; overflow:hidden; display:grid; place-items:center; font-size:110px; color:#fff;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); border-radius:22px; }
  .pp-cover img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
  .pp-top { position:absolute; top:12px; left:12px; right:12px; display:flex; justify-content:space-between; }
  .cr-top { display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:10px; position:relative; z-index:30; }      /* 菜单要盖在下面的资料卡上面 */
  .hbtn2 { width:40px; height:40px; padding:0; border:0; background:none; font-size:28px; line-height:1; border-radius:50%; }
  .cr-top .pp-menu { color:#eee; } .cr-top .pp-menu-wrap { height:40px; }
  .mnew { position:fixed; right:20px; bottom:calc(84px + env(safe-area-inset-bottom)); z-index:30; width:56px; height:56px; padding:0; border:0; border-radius:50%; background:var(--grad); color:#fff; font-size:30px; line-height:1; box-shadow:0 6px 18px rgba(124,58,237,.4); display:flex; align-items:center; justify-content:center; }      /* 创作页右下角的圆形「＋」新建按钮（悬浮在底部导航上方） */
  .mnew .mnew-t { display:none; }
  @media (min-width:721px) { .mnew { position:static; float:right; margin-top:2px; width:auto; height:40px; padding:0 18px 0 14px; gap:6px; border-radius:999px; font-size:20px; box-shadow:0 4px 14px rgba(124,58,237,.35); } .mnew .mnew-t { display:inline; font-size:14px; font-weight:600; } }      /* 电脑网页：浮到「剧情 / 世界书 / 动态」标签栏右端，带文字，更显眼（不能放进带动画 transform 的容器里，否则 fixed 会错位） */
  .cr-bar { display:flex; justify-content:space-between; align-items:center; margin:6px 0 14px; color:var(--muted); } .cr-bar select, .filterrow select { width:auto; padding:6px 30px 6px 14px; font-size:13px; border-radius:999px; appearance:none; -webkit-appearance:none; cursor:pointer; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12' fill='none' stroke='%237d7d99' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 11px center; background-size:12px; }      /* 自己画的下拉箭头，右边留出位置，文字不压箭头 */
  .pp-like { position:absolute; right:14px; bottom:14px; display:flex; align-items:center; gap:7px; height:40px; padding:0 16px; border:0; border-radius:999px; color:#fff; font-size:15px; font-weight:600; background:rgba(0,0,0,.45); backdrop-filter:blur(8px); }
  .pp-like .hrt { font-size:20px; line-height:1; } .pp-like.on .hrt { color:var(--danger); } .pp-like:hover { transform:none; }
  .bellbtn { position:relative; width:38px; height:38px; padding:0; border:0; background:none; font-size:20px; border-radius:50%; }
  .bellbtn i { position:absolute; top:1px; right:-1px; min-width:17px; height:17px; padding:0 4px; border-radius:9px; background:var(--danger); color:#fff; font-size:11px; font-style:normal; font-weight:700; line-height:17px; text-align:center; } .bellbtn i[hidden] { display:none; }
  .nc { max-width:760px; margin:0 auto; padding-bottom:84px; }
  .nc-sec { color:var(--muted); font-size:14px; padding:18px 4px 8px; }
  .nc-item { display:flex; gap:14px; align-items:center; padding:14px 6px; border-bottom:1px solid var(--border); cursor:pointer; position:relative; }
  .nc-item.unread::before { content:""; position:absolute; left:-2px; top:50%; width:7px; height:7px; margin-top:-3.5px; border-radius:50%; background:var(--danger); }
  .nc-av { flex:none; } .nc-sys { width:46px; height:46px; border-radius:50%; display:grid; place-items:center; background:var(--card2); border:1px solid var(--border); font-size:20px; }
  .nc-body { flex:1; min-width:0; } .nc-top { display:flex; justify-content:space-between; gap:10px; font-size:13px; } .nc-text { margin-top:3px; line-height:1.5; overflow:hidden; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; word-break:break-word; }
  .nc-x { flex:none; width:30px; height:30px; padding:0; border:0; background:none; color:var(--muted); border-radius:50%; }
  .nc-foot { position:fixed; left:0; right:0; bottom:0; z-index:30; display:flex; gap:10px; justify-content:center; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:var(--bar); backdrop-filter:blur(16px); border-top:1px solid var(--border); } .nc-foot[hidden] { display:none; } .nc-foot button { flex:1; max-width:240px; height:44px; border-radius:12px; }
  .switchrow { display:flex; justify-content:space-between; align-items:center; gap:12px; margin:0; padding:14px 4px; border-bottom:1px solid var(--border); font-size:15px; font-weight:500; color:var(--fg); text-align:left; } .switchrow input { width:44px; height:24px; flex:none; accent-color:var(--accent2); }
  .msg { -webkit-touch-callout:none; }
  dialog.sheet { width:100%; max-width:560px; margin:auto auto 0; padding:10px 16px calc(18px + env(safe-area-inset-bottom)); border:0; border-radius:26px 26px 0 0; background:#222; color:#eee; box-shadow:0 -10px 40px rgba(0,0,0,.4); }
  dialog.sheet::backdrop { background:rgba(0,0,0,.5); } dialog.sheet:not([open]) { display:none; }
  .sh-grip { width:42px; height:5px; border-radius:3px; background:#555; margin:2px auto 14px; }
  .sg { background:#333; border-radius:16px; margin-bottom:12px; overflow:hidden; }
  .sg button { display:flex; align-items:center; gap:16px; width:100%; padding:17px 18px; border:0; border-radius:0; background:none; color:#eee; font-size:16.5px; text-align:left; border-bottom:1px solid rgba(255,255,255,.07); }
  .sg button:last-child { border-bottom:0; } .sg button i { font-style:normal; width:24px; text-align:center; font-size:19px; } .sg button.danger { color:#ff453a; } .sg button:hover { background:rgba(255,255,255,.06); transform:none; }
  dialog.capdlg { width:100%; max-width:640px; height:100dvh; max-height:100dvh; margin:0 auto; padding:0; border:0; border-radius:0; display:flex; flex-direction:column; background:var(--bg); color:var(--fg); }
  dialog.capdlg:not([open]) { display:none; } dialog.capdlg::backdrop { background:#000; }
  .cap-top { display:flex; align-items:center; justify-content:space-between; padding:10px 12px; border-bottom:1px solid var(--border); } .cap-top b { font-size:17px; }
  .cap-top button { border:0; background:none; padding:6px 12px; font-size:24px; border-radius:10px; } .cap-top button.link { font-size:15px; color:var(--accent2); font-weight:600; } .cap-top span { display:flex; }
  .cap-list { flex:1; min-height:0; overflow-y:auto; padding:12px 14px; display:flex; flex-direction:column; gap:10px; }
  .capitem { border:2px solid transparent; border-radius:18px; padding:6px; cursor:pointer; display:flex; flex-direction:column; gap:8px; } .capitem.sel { border-color:var(--accent2); background:color-mix(in srgb,var(--accent2) 8%,transparent); }
  .capitem .msg { max-width:100%; animation:none; } .capitem * { pointer-events:none; }
  .cap-foot { padding:12px 14px calc(12px + env(safe-area-inset-bottom)); border-top:1px solid var(--border); } .cap-foot button { width:100%; height:50px; border-radius:14px; font-size:16px; font-weight:600; }
  .capwrap { position:fixed; left:-10000px; top:0; padding:18px; background:var(--bg); display:flex; flex-direction:column; gap:12px; font:14px/1.6 var(--font-sans); color:var(--fg); }
  .capwrap * { animation:none !important; transition:none !important; } .capwrap .msg { max-width:92%; } .capwrap .cw-row { display:flex; flex-direction:column; gap:8px; }
  .cw-title { font-weight:700; font-size:17px; padding-bottom:4px; } .cw-mark { text-align:center; font-size:12px; color:var(--muted); letter-spacing:1px; padding-top:6px; }
  dialog.drawer { margin:0 0 0 auto; height:100dvh; max-height:100dvh; width:min(86vw,390px); padding:0; border:0; border-radius:0; background:#222; color:#eee; animation:drIn .22s ease; }
  dialog.drawer::backdrop { background:rgba(0,0,0,.55); } dialog.drawer:not([open]) { display:none; } @keyframes drIn { from { transform:translateX(30px); opacity:0; } to { transform:none; opacity:1; } }
  .dr-in { height:100%; display:flex; flex-direction:column; padding:22px 18px calc(10px + env(safe-area-inset-bottom)); }
  .dr-in > button { display:flex; align-items:center; flex-wrap:wrap; gap:4px 8px; width:100%; padding:15px 6px; border:0; border-radius:12px; background:none; color:#eee; text-align:left; font-size:17px; }
  .dr-in > button b { font-weight:500; flex:1; } .dr-in > button small { flex:1 0 100%; color:#9a9aa5; font-size:13.5px; line-height:1.5; } .dr-in > button span { color:#9a9aa5; font-size:15px; } .dr-in > button i { font-style:normal; color:#9a9aa5; font-size:22px; }
  .dr-in > button:hover { background:rgba(255,255,255,.05); transform:none; } .dr-in hr { border:0; border-top:1px solid rgba(255,255,255,.1); margin:12px 0; }
  .dr-foot { margin-top:auto; border-top:1px solid rgba(255,255,255,.1); padding-top:6px; } .dr-foot button { width:100%; padding:15px 6px; border:0; background:none; color:#aaa; font-size:17px; text-align:left; }
  .sh-title { color:#9a9aa5; font-size:15px; padding:0 4px 12px; } .sh-col { flex:1; min-width:0; display:flex; flex-direction:column; align-items:flex-start; } .sh-col b { font-weight:600; font-size:16px; } .sh-col small { color:#9a9aa5; font-size:13px; max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .sh-empty { padding:22px 16px; color:#9a9aa5; text-align:center; font-size:14px; line-height:1.6; }
  .pf-add { width:46px; height:46px; border-radius:50%; background:#444; display:grid; place-items:center; font-size:22px; flex:none; }
  .pf-row.cur { cursor:default; }
  .pf-row, .bm-row { display:flex; align-items:center; gap:14px; padding:14px 16px; border-bottom:1px solid rgba(255,255,255,.07); cursor:pointer; } .pf-row:last-child, .bm-row:last-child { border-bottom:0; }
  .pf-av { position:relative; width:48px; height:48px; border-radius:50%; background:#555; display:grid; place-items:center; font-size:22px; flex:none; } .pf-av img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
  .pf-ck { position:absolute; right:-3px; bottom:-3px; width:20px; height:20px; border-radius:50%; background:var(--accent2); color:#fff; font-size:12px; font-style:normal; display:grid; place-items:center; }
  .pf-def { font-style:normal; font-size:11px; padding:1px 7px; border-radius:8px; background:#444; color:#bbb; margin-left:6px; } .pf-edit { width:34px; height:34px; padding:0; border:0; background:none; color:#aaa; font-size:17px; border-radius:50%; }
  .sg button.pf-edit { width:34px; flex:none; height:34px; padding:0; gap:0; display:grid; place-items:center; border-bottom:0; }      /* .sg button 的 width:100% 会把编辑按钮撑满整行，把名字挤成一列 */
  .bm-row i { font-style:normal; font-size:20px; }
  .pf-form { gap:6px; } .pf-head { display:flex; align-items:center; gap:16px; margin-bottom:10px; } .pf-nm { font-size:22px; } .pf-l { margin:14px 0 6px; font-size:16px; font-weight:600; color:var(--fg); }
  .pf-avbtn { position:relative; width:84px; height:84px; padding:0; border-radius:50%; border:0; background:var(--card2); font-size:36px; display:grid; place-items:center; } .pf-avbtn img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
  .pf-avbtn i { position:absolute; right:-2px; bottom:-2px; width:30px; height:30px; border-radius:50%; background:var(--accent2); color:#fff; font-style:normal; font-size:14px; display:grid; place-items:center; }
  .pf-cnt { color:var(--accent2); font-size:13px; } .pf-del { margin-top:16px; border:0; background:none; color:#e5484d; padding:10px; }
  .msg.bm { position:relative; } .msg.bm::after { content:""; position:absolute; right:-24px; bottom:8px; width:18px; height:18px; background:#8b8b96; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M21.4 11.6l-9-9A2 2 0 0 0 11 2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 .6 1.4l9 9a2 2 0 0 0 2.8 0l7-7a2 2 0 0 0 0-2.8zM7.5 8a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z'/%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'%3E%3Cpath d='M21.4 11.6l-9-9A2 2 0 0 0 11 2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 .6 1.4l9 9a2 2 0 0 0 2.8 0l7-7a2 2 0 0 0 0-2.8zM7.5 8a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3z'/%3E%3C/svg%3E") center/contain no-repeat; }
  .bm-editbtn { border:0; background:none; color:var(--accent2); font-size:16px; min-width:40px; } .bm-list .bm-row { padding:16px 4px; } .bm-list .sh-col b { font-weight:500; font-size:17px; color:var(--fg); } .bm-list .sh-col small { white-space:normal; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; margin-top:6px; font-size:14px; line-height:1.5; }
  .msg.flash { animation:flash 1.6s ease; } @keyframes flash { 0%,60% { box-shadow:0 0 0 3px var(--accent2); } 100% { box-shadow:0 0 0 0 transparent; } }
  .cm-banner { display:flex; align-items:center; gap:8px; width:100%; margin:12px 0 4px; padding:14px 16px; border-radius:14px; border:1px solid var(--accent2); background:var(--card); text-align:left; }
  .cm-banner span { color:var(--accent2); font-weight:700; } .cm-banner b { flex:1; font-weight:600; } .cm-banner i { font-style:normal; color:var(--muted); font-size:20px; }
  .seeall { color:var(--accent2); font-weight:700; font-size:14px; cursor:pointer; }
  .cm-card { width:260px; padding:14px; border-radius:16px; background:var(--card); border:1px solid var(--border); cursor:pointer; }
  .cm-card-h { display:flex; align-items:center; gap:8px; } .cm-card-h b { flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; } .cm-card-h .muted { font-size:12px; }
  .cm-card p { margin:10px 0 8px; line-height:1.5; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
  .wav { width:32px; height:32px; border-radius:50%; overflow:hidden; display:grid; place-items:center; flex:none; background:var(--card2); font-weight:700; font-size:14px; } .wav img { width:100%; height:100%; object-fit:cover; }
  .cm { max-width:760px; margin:0 auto; padding-bottom:110px; }
  .cm-head { display:flex; align-items:center; gap:8px; position:sticky; top:0; z-index:10; padding:10px 0; background:var(--bg); } .cm-head b { flex:1; text-align:center; font-size:17px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .cm-head #cmtotal { min-width:40px; padding-right:14px; text-align:right; }      /* 评论数别贴着右边缘 */
  .cm-tabs { display:flex; border-bottom:1px solid var(--border); } .cm-tabs button { flex:1; border:0; border-radius:0; background:none; padding:12px; font-weight:600; color:var(--muted); border-bottom:2px solid transparent; } .cm-tabs button.on { color:var(--fg); border-bottom-color:var(--fg); } .cm-tabs button:hover { transform:none; }
  .cm-item { display:flex; gap:12px; padding:16px 2px; } .cm-item.reply { padding:10px 0 4px; } .cm-item .wav.sm { width:34px; height:34px; cursor:pointer; } .cm-item.reply .wav.sm { width:28px; height:28px; }
  .cm-item.hid .cm-text { opacity:.55; } .cm-hidden { font-size:12px; color:var(--accent); margin:2px 0; }
  .cm-body { flex:1; min-width:0; } .cm-meta { display:flex; align-items:center; gap:10px; } .cm-meta b { font-size:14px; color:var(--muted); font-weight:600; cursor:pointer; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .cm-meta .muted { font-size:12.5px; } .cm-more button { width:30px; height:30px; padding:0; border:0; background:none; font-size:20px; } .cm-more .pp-menu { top:32px; z-index:20; min-width:150px; } .cm-more { height:30px; }
  .cm-text { margin:4px 0 8px; line-height:1.6; white-space:pre-wrap; word-break:break-word; }
  .cm-acts button.on .hrt { color:var(--danger); }
  .cm-acts { display:flex; gap:18px; } .cm-acts button { padding:2px 0; border:0; background:none; color:var(--muted); font-size:14px; } .cm-acts button:hover { transform:none; color:var(--fg); } .cm-acts button.on { color:var(--danger); }
  .cm-show { border:0; background:none; color:var(--muted); font-weight:600; padding:6px 0; }
  .cm-replies { border-left:2px solid var(--border); margin-top:6px; padding-left:12px; } .cm-replies:empty { display:none; }
  .cm-more-btn { display:block; margin:10px auto; }
  .cm-input { position:fixed; left:0; right:0; bottom:0; z-index:30; padding:10px 14px calc(10px + env(safe-area-inset-bottom)); background:var(--bar); backdrop-filter:blur(16px); border-top:1px solid var(--border); }
  .cm-input > * { max-width:760px; margin-left:auto; margin-right:auto; } .cm-row { display:flex; gap:10px; align-items:flex-end; } .cm-row textarea { flex:1; resize:none; max-height:120px; border-radius:22px; padding:11px 16px; } .cm-row button { width:44px; height:44px; padding:0; border-radius:50%; flex:none; }
  .cm-replyto { font-size:13px; color:var(--muted); margin-bottom:6px; } .cm-replyto[hidden] { display:none; } .cm-replyto button { border:0; background:none; padding:0 6px; }
  .msg.imgmsg { flex:none; position:relative; padding:0; background:none; border:0; box-shadow:none; overflow:hidden; border-radius:18px; max-width:min(420px,92%); }
  .msg.imgmsg > img { display:block; width:100%; max-width:none; border-radius:18px; cursor:zoom-in; }
  .msg.imgmsg.loading > img { opacity:.45; filter:blur(2px); }
  .imgact { position:absolute; left:10px; bottom:10px; display:flex; gap:8px; }
  .imgact button { width:38px; height:38px; padding:0; border:0; border-radius:50%; font-size:17px; display:grid; place-items:center; background:rgba(0,0,0,.5); backdrop-filter:blur(6px); filter:grayscale(1) brightness(1.6); }
  .imgact button.on { filter:none; background:rgba(126,224,200,.75); } .imgact button:hover { transform:none; }
  .snap-skel { flex:none; align-self:flex-start; width:min(420px,92%); aspect-ratio:1/1; border-radius:20px; background:var(--card); border:1px solid var(--border); display:grid; place-items:center; align-content:center; gap:14px; text-align:center; padding:20px; }
  .snap-skel .spin { width:38px; height:38px; border-radius:50%; border:3px solid var(--border); border-top-color:var(--accent2); animation:spin 1s linear infinite; }
  @keyframes spin { to { transform:rotate(360deg); } }
  .snap-skel .sk-t b { display:block; font-size:17px; margin-top:6px; } .snap-skel .sk-t p { margin:6px 0 0; color:var(--muted); font-size:13px; line-height:1.6; } .snap-skel .sk-t p.sk-n { margin-top:10px; font-size:12.5px; color:var(--accent2); }
  dialog.snapdlg { width:100%; max-width:560px; height:100dvh; max-height:100dvh; margin:0 auto; padding:0; border:0; border-radius:0; display:flex; flex-direction:column; background:#111; color:#eee; }
  dialog.snapdlg:not([open]) { display:none; } dialog.snapdlg::backdrop { background:#000; }
  .snap-top { display:flex; align-items:center; justify-content:space-between; padding:12px 14px; } .snap-top b { font-size:17px; } .snap-top span { display:flex; gap:6px; }
  .snap-top button { width:42px; height:42px; padding:0; border:0; background:none; color:#eee; font-size:22px; border-radius:50%; }
  .snap-img { flex:1; min-height:0; display:grid; place-items:center; overflow:hidden; } .snap-img img { max-width:100%; max-height:100%; object-fit:contain; }
  .snap-acts { display:flex; justify-content:space-around; padding:12px 6px 6px; } .snap-acts button { border:0; background:none; color:#bbb; display:flex; flex-direction:column; align-items:center; gap:4px; font-size:13px; padding:6px 14px; } .snap-acts button i { font-style:normal; font-size:22px; filter:grayscale(1) brightness(1.5); } .snap-acts button.on { color:#fff; } .snap-acts button.on i { filter:none; } .snap-acts button:hover { transform:none; }
  .snap-share { margin:6px 16px calc(16px + env(safe-area-inset-bottom)); height:50px; border-radius:12px; font-size:16px; font-weight:600; }
  dialog.lightbox { max-width:96vw; max-height:96vh; width:auto; padding:0; border:0; background:none; box-shadow:none; } dialog.lightbox img { display:block; max-width:96vw; max-height:92vh; border-radius:12px; }
  .cm-img { display:block; max-width:min(320px,100%); border-radius:12px; margin:4px 0 8px; cursor:zoom-in; } .cm-img.sm { max-height:140px; width:auto; margin:6px 0; }
  .pp-top { align-items:flex-start; } .pp-tr { display:flex; gap:10px; align-items:flex-start; } .pp-menu-wrap { position:relative; display:flex; height:42px; }
  .pp-menu { position:absolute; right:0; top:50px; min-width:190px; z-index:50; background:#222; color:#eee; border-radius:16px; overflow:hidden; box-shadow:0 14px 40px rgba(0,0,0,.45); }
  .pp-menu[hidden] { display:none; }
  .pp-menu button { display:block; width:100%; width:100% !important; height:auto !important; text-align:left; padding:14px 18px !important; border-radius:0 !important; background:none !important; color:#eee !important; font-size:15px !important; border:0; border-bottom:1px solid rgba(255,255,255,.08); backdrop-filter:none !important; }
  .pp-menu button:last-child { border-bottom:0; } .pp-menu button:hover { background:rgba(255,255,255,.07) !important; transform:none; }
  dialog.cfm { max-width:400px; text-align:center; } dialog.cfm h3 { margin:4px 0 12px; font-size:19px; } dialog.cfm p { margin:0 0 12px; color:var(--muted); line-height:1.6; }
  .cfm-notes { font-size:12.5px; color:var(--muted); line-height:1.7; margin-bottom:18px; opacity:.85; }
  .cfm-btns { display:flex; gap:10px; margin-top:16px; } .cfm-btns button { flex:1; height:46px; border-radius:12px; font-weight:600; }
  dialog.cfm .opt { text-align:left; }
  .pp-top button { display:grid; place-items:center; } .pp-top button .ic { display:block; }
  .pp-top button { width:42px; height:42px; padding:0; border-radius:50%; border:0; font-size:22px; color:#fff; background:rgba(0,0,0,.4); backdrop-filter:blur(6px); }
  .pp-main h1 { margin:0 0 6px; font-size:28px; line-height:1.25; }
  .pp-syn { margin:0 0 10px; font-size:16px; font-weight:600; }
  .pp-tags { color:var(--muted); margin-bottom:10px; }
  .pp-chips { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; } .pp-chips span { font-size:12px; padding:3px 10px; border-radius:8px; background:var(--card2); color:var(--muted); }
  .pp-owner { display:flex; align-items:center; gap:10px; padding:12px 0; margin-bottom:6px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); color:var(--muted); } .pp-owner[data-uid] { cursor:pointer; }
  .pp-owner .wav { width:34px; height:34px; border-radius:50%; overflow:hidden; display:grid; place-items:center; background:var(--card2); font-weight:700; } .pp-owner .wav img { width:100%; height:100%; object-fit:cover; }
  .pp-h { margin:26px 0 10px; font-size:19px; }
  .pp-cast { display:grid; gap:10px; } .pp-char { display:flex; gap:12px; align-items:center; padding:10px 12px; border-radius:16px; background:var(--card); border:1px solid var(--border); }
  .ob { display:flex; flex-direction:column; gap:12px; }
  .ob-nar { font-style:italic; color:var(--muted); padding:0 4px; line-height:1.8; white-space:pre-wrap; }
  .ob-row { display:flex; gap:10px; align-items:flex-start; } .ob-av { width:42px !important; height:42px !important; font-size:20px !important; }
  .ob-who { font-size:12px; color:var(--muted); margin-bottom:3px; }
  .ob-msg { display:inline-block; padding:10px 14px; border-radius:6px 18px 18px 18px; background:var(--bubble); border:1px solid var(--border); white-space:pre-wrap; line-height:1.7; }
  .pp-bar { position:fixed; left:0; right:0; bottom:0; z-index:30; background:var(--bar); backdrop-filter:blur(16px); border-top:1px solid var(--border); padding:12px 14px calc(12px + env(safe-area-inset-bottom)); }
  .pp-bar-in { max-width:1000px; margin:0 auto; display:flex; gap:12px; } .pp-bar button { height:50px; border-radius:14px; font-size:16px; font-weight:600; }
  .pp-bar .favbtn { width:64px; flex:none; font-size:24px; padding:0; color:var(--accent2); } .pp-bar .primary { flex:1; }
  .pp-bar #ppgo, .pp-bar #ppcont { flex:1; min-width:0; padding:0 8px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:15px; }      /* 有历史对话时「继续上次」和「开启新对话」并排 */
  @media (min-width:900px) {
    .pp { display:grid; grid-template-columns:380px 1fr; gap:36px; align-items:start; }
    .pp-cover { position:sticky; top:24px; max-height:calc(100vh - 140px); }
    .pp-bar-in { padding-left:416px; }
  }
  @media (max-width:899px) { main.wide .pp { margin:-16px -14px 0; max-width:none; } .pp-cover { border-radius:0; } .pp-main { padding:18px 16px 0; } }
  .iconbtn { width:38px; height:38px; padding:0; border-radius:50%; font-size:16px; display:grid; place-items:center; flex:none; }
  .list-item b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .libhead { display:flex; align-items:baseline; justify-content:space-between; margin:0 0 10px; } .libhead h3 { margin:0; font-size:18px; } .libhead a { color:var(--muted); cursor:pointer; font-size:14px; }
  .fav-row { gap:12px; padding-bottom:6px; }
  .ftile { width:88px; cursor:pointer; } .ftile .fcov { width:88px; height:118px; border-radius:12px; overflow:hidden; display:grid; place-items:center; font-size:38px; color:#fff;
    background:linear-gradient(135deg,hsl(var(--h) 78% 55%),hsl(calc(var(--h) + 48) 72% 36%)); box-shadow:var(--shadow); } .ftile img { width:100%; height:100%; object-fit:cover; }
  .ftile .ftt { margin-top:6px; font-size:12.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .toast { position:fixed; left:50%; bottom:90px; transform:translateX(-50%); z-index:100; padding:10px 20px; border-radius:999px; background:var(--fg); color:var(--bg); font-weight:600; box-shadow:0 10px 30px rgba(0,0,0,.35); animation:pop .25s ease both; }
  .toast.bad { background:var(--accent); color:#fff; }
  .toast.ready { border:0; cursor:pointer; font:inherit; font-weight:600; }      /* 可点击的「生成好了」提示 */
  @media (max-width:900px) { .admin { grid-template-columns:1fr; } .acol { position:static; } .alist { max-height:260px; } .two { grid-template-columns:1fr; } }

  /* ---------- mobile ---------- */
  @media (max-width:720px) {
    /* 手机上固定条的毛玻璃（backdrop-filter）滚动时每帧都要重新模糊，是卡顿的常见来源：换成不透明背景 */
    .pp-bar, .cm-input, .nc-foot, .inputbar, .chat-head, .cm-head, nav, .savebar, .wiz-foot { backdrop-filter:none !important; -webkit-backdrop-filter:none !important; background:var(--bg) !important; }
    :root { --hh:56px; }
    /* header 上的 backdrop-filter 会让内部 fixed 元素以 header 为定位参照，手机端底部导航需要去掉它 */
    #ptchip { display:none !important; }      /* 手机顶栏不显示点数：「我的」页里有「点数」入口（JS 给它设的是行内样式，所以要 !important） */
    header { position:static; padding:0 16px; backdrop-filter:none; -webkit-backdrop-filter:none; background:color-mix(in srgb,var(--bg) 94%,transparent); }      /* 手机：顶栏随页面滚走，不浮在顶上（电脑端顶栏里有导航，仍然固定） */
    nav { position:fixed; left:0; right:0; bottom:0; margin:0; gap:0; height:calc(64px + env(safe-area-inset-bottom)); padding:6px 8px env(safe-area-inset-bottom);
      background:var(--bar); backdrop-filter:saturate(1.6) blur(18px); -webkit-backdrop-filter:saturate(1.6) blur(18px); border-top:1px solid var(--border); justify-content:space-around; z-index:50; }
    nav button { flex-direction:column; gap:0; padding:6px 2px; font-size:11px; border-radius:16px; flex:1; min-width:0; white-space:nowrap; }
    nav button i { font-size:20px; line-height:1.3; }
    nav button.active { background:none; box-shadow:none; color:var(--accent2); font-weight:700; }      /* 选中只变色，不要渐变大块 */
    .hero { padding:0 0 10px; } .hero h2 { font-size:19px; margin:0 0 3px; } .hero p { font-size:12px; line-height:1.4; }      /* 手机首页「选一个故事」：保留，但缩小，让卡片尽早露出来 */
    .cats-row { position:sticky; top:0; z-index:30; margin:0 -14px 6px; padding:8px 14px; background:var(--bg); }      /* 「Yume / 故事聊天…」那一行：顶栏随页面滚走后固定在最上面 */
    header .langbox { margin-left:auto; padding:0; } header .userbox { display:flex; gap:4px; } header .userbox .whobtn:not(.guest) { display:none; } #nav-mine { display:flex; } .mine-item { padding:10px 12px; gap:10px; } .mine-item .ico { width:52px; height:52px; } #uilang { padding:6px 26px 6px 10px; font-size:13px; }
    main { padding:16px 14px calc(90px + env(safe-area-inset-bottom)); }
    .grid { grid-template-columns:repeat(2,1fr); gap:3px; }
    .grid:not(.hrow):has(> .card.plot) { margin-inline:-11px; }      /* 剧情卡片墙：左右只留约 3px、卡片之间 3px（main 本身有 14px），圆角同步收小 */
    .card.plot { border-radius:8px; }
    .card.plot .cover { font-size:64px; }
    .card.plot .pbody { padding:26px 8px 8px; gap:2px; } .card.plot .pbody h3 { font-size:13px; line-height:1.28; } .card.plot .syn { font-size:11px; line-height:1.38; } .card.plot .pmeta { font-size:10.5px; }
    .card.char .info { padding:36px 10px 10px; } .card.char h3 { font-size:15px; } .card.char .emo { font-size:64px; }
    .msg { max-width:92%; font-size:15px; }
    .toolbar input { flex:1 1 100%; min-width:0; }
  }
  @media (prefers-reduced-motion: reduce) { * { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }


/* ===== Yume UI v1 覆盖层：按设计规范统一按钮 / 导航 / 卡片 / 标题 ===== */
.logo { font-family:var(--font-serif); font-weight:600; font-size:24px; letter-spacing:.02em; background:none; -webkit-background-clip:border-box; background-clip:border-box; color:var(--text-100); }
header { background:var(--bg-000); border-bottom:1px solid var(--line-100); backdrop-filter:none; -webkit-backdrop-filter:none; }
@media (min-width:721px) {
nav button { color:var(--text-200); font-weight:500; border-radius:0; padding:22px 12px; position:relative; background:none; }
nav button:hover { color:var(--text-100); background:none; }
nav button.active { color:var(--text-100); background:none; box-shadow:none; font-weight:600; }
nav button.active::after { content:""; position:absolute; left:12px; right:12px; bottom:0; height:2px; border-radius:2px; background:var(--brand); }
nav button i { display:none; }
}
@media (max-width:720px) { nav button.active { color:var(--brand-text); } }
h1, h2, .hero h2, .sec0 { font-family:var(--font-serif); font-weight:600; letter-spacing:.02em; }
.hero h2 { font-size:clamp(28px,4.2vw,44px); line-height:1.25; }
button { border-radius:var(--radius-full, 999px); border:1px solid var(--line-200); background:transparent; color:var(--text-100); font-weight:600; transition:background .12s, border-color .12s, transform .12s; }
button:hover { transform:none; background:var(--bg-300); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--brand-text); outline-offset:2px; }
button.primary { border:1px solid transparent; background:var(--brand); color:var(--on-brand); box-shadow:none; }
button.primary:hover { background:var(--brand-hover); box-shadow:var(--shadow-brand); }
button.primary:active { background:var(--brand-pressed); }
button:disabled, button.primary:disabled { background:var(--bg-300); color:var(--text-400); border-color:transparent; box-shadow:none; }
input, textarea, select { border-radius:var(--radius-md); background:var(--bg-100); border:1px solid var(--line-200); }
input:focus, textarea:focus, select:focus { border-color:var(--brand); box-shadow:none; }
::placeholder { color:var(--text-300); }
.tabs { background:none; border:0; padding:0; gap:8px; }
.tabs button { border:1px solid var(--line-200); padding:0 16px; height:36px; font-weight:600; color:var(--text-200); }
.tabs button.active, .filterrow .tabs button.active { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); box-shadow:none; }
.toolbar button { background:transparent; }
.toolbar button:hover { border-color:var(--brand); color:var(--brand-text); }
.card, .ccard { border:0; border-radius:var(--radius-lg); background:var(--bg-100); box-shadow:var(--shadow); }
.card:hover, .ccard:hover { transform:translateY(-2px); border-color:transparent; box-shadow:var(--shadow); }
.card.plot { border-radius:var(--radius-lg); }
.card.plot:hover { box-shadow:0 12px 32px rgba(0,0,0,.35); }
.card.plot .pbody { background:linear-gradient(180deg,rgba(10,15,26,0) 0%,rgba(10,15,26,.88) 100%); }
.card.plot .pbody h3 { font-family:var(--font-serif); font-weight:600; }
.card.plot .pplug { color:var(--warning); }
.err { color:var(--danger); }
::selection { background:var(--brand-soft); }
/* 品牌色底上的文字用 --on-brand（深色），保证对比度 */
[data-price]::after, .msg.user, .badge, .toolbar button.on, .dot.cur, .whobtn.guest, .whobtn.guest #loginbtn, .opsnav button.active, .chip.on, .pf-ck, .pf-avbtn i, .toast.bad { color:var(--on-brand); }
.msg.user { box-shadow:none; background:var(--brand-soft); color:var(--text-100); }
.msg.user .nar { color:var(--text-200); } .msg.user .say { color:var(--text-100); }
.dot.cur, .whobtn.guest { box-shadow:none; }
.whobtn.guest { background:var(--brand); }
.toast.bad { background:var(--danger); }
.mnew { background:var(--brand); color:var(--on-brand); box-shadow:var(--shadow-brand); }
.logo { display:flex; align-items:center; gap:10px; }
.brand-img { width:36px; height:36px; object-fit:contain; flex:none; }
.brand-img.lg { width:72px; height:72px; }

/* 顶栏搜索 + 日夜切换 */
.hsearch-top { display:flex; align-items:center; gap:8px; height:40px; width:300px; padding:0 14px; border-radius:999px; background:var(--bg-100); border:1px solid var(--line-100); color:var(--text-300); }
.hsearch-top:focus-within { border-color:var(--brand); }
.hsearch-top input { all:unset; flex:1; min-width:0; color:var(--text-100); font-size:14px; }
.hsearch-top input::placeholder { color:var(--text-300); }
.hsearch-top svg { flex:none; }
.iconbtn { width:40px; height:40px; padding:0; border:0; border-radius:50%; display:inline-grid; place-items:center; color:var(--text-200); background:none; }
.iconbtn:hover { background:var(--bg-300); color:var(--text-100); }
@media (max-width:720px) { .hsearch-top, .iconbtn.theme { display:none; } }

/* 首页 Hero：整幅夜景插画，文字固定浅色（图是暗的，昼色下也一样） */
.hero.hero-v1 { position:relative; overflow:hidden; width:100vw; margin:-28px 0 24px calc(50% - 50vw); padding:0; min-height:320px; display:flex; align-items:center; background:#0a0f1a; color:#eef1f6; }
.hero-v1 .hero-pic { position:absolute; inset:0 0 0 22%; width:78%; height:100%; object-fit:cover; }
.hero-v1::before { content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,#0a0f1a 28%,rgba(10,15,26,.55) 58%,rgba(10,15,26,.1) 100%); }
.hero-v1 .hero-in { position:relative; z-index:2; width:100%; max-width:1280px; margin:0 auto; padding:40px; }
.hero-v1 h2 { font-size:clamp(34px,5vw,56px); line-height:1.25; margin:0 0 12px; color:#eef1f6; }
.hero-v1 h2 .accent { color:#b9a6f5; }
.hero-v1 p { margin:0 0 24px; color:#c3cad8; font-size:15px; }
.hero-v1 .hero-btns { display:flex; align-items:center; gap:20px; }
.hero-v1 .hero-go { height:52px; padding:0 28px; font-size:16px; color:#06231d; background:#7ee0c8; border:0; box-shadow:0 8px 24px rgba(126,224,200,.22); }
.hero-v1 .hero-go:hover { background:#9ae9d6; }
.hero-v1 .hero-guide { border:0; background:none; color:#7ee0c8; padding:0 4px; }
.hero-v1 .hero-guide:hover { background:none; text-decoration:underline; text-underline-offset:4px; }
@media (max-width:720px) {
  .hero.hero-v1 { margin:-16px 0 14px calc(50% - 50vw); min-height:0; flex-direction:column; align-items:stretch; }
  .hero-v1 .hero-pic { position:relative; inset:auto; width:100%; height:auto; aspect-ratio:1/.85; object-position:18% center; }      /* 横图（1440×680）：图单独占顶部一块，不再被文字盖在人脸上；高度跟宽度走（不放大裁切），18% 让男主的脸和女主一起入镜，底部渐隐进深色背景 */
  .hero-v1::before { inset:0 0 auto 0; aspect-ratio:1/.85; background:linear-gradient(180deg,rgba(10,15,26,0) 35%,#0a0f1a 92%); }
  .hero-v1 .hero-in { margin-top:-150px; padding:0 16px 24px; }
  .hero-v1 h2 { font-size:34px; }
  .hero-v1 p { font-size:14px; }
  .hero-v1 .hero-btns { flex-direction:column; align-items:stretch; }
  .hero-v1 .hero-go { width:100%; justify-content:center; }
  .hero-v1 .hero-guide { display:none; }
}

/* ===== 首页：分类标签条 + 故事卡片（Yume UI v1：上图下文） ===== */
main:has(.cats-row), main:has(.disc-head) { max-width:1280px; padding-left:40px; padding-right:40px; }
.cats-row { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0 0 28px; }
.cats { margin:0; padding:0; gap:8px; }
.cats button { height:36px; padding:0 16px; font-size:14px; font-weight:600; color:var(--text-200); background:transparent; border:1px solid var(--line-200); border-radius:999px; }
.cats button:hover { color:var(--text-100); background:transparent; }
.cats button.on { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); box-shadow:none; }
.hicons { gap:4px; }
.hicons button { width:auto; height:auto; border:0; background:none; border-radius:0; font-size:14px; font-weight:600; color:var(--brand-text); padding:6px 4px; display:inline-flex; }
.hicons button:hover { background:none; text-decoration:underline; text-underline-offset:4px; }
.hicons #qbtn { display:none; }
.section-heading { display:flex; align-items:baseline; gap:16px; flex-wrap:wrap; margin:0 0 24px; }
.section-heading h2 { margin:0; font-size:28px; line-height:38px; }
.section-heading p { margin:0; font-size:14px; }
main:has(.cats-row) .grid, main:has(.disc-head) .grid { grid-template-columns:repeat(auto-fill,minmax(270px,1fr)); gap:24px; }
main:has(.cats-row) .grid.hrow { grid-template-columns:none; grid-auto-flow:column; grid-auto-columns:minmax(240px,270px); overflow-x:auto; }

.card.plot { display:flex; flex-direction:column; aspect-ratio:auto; color:var(--text-100); border-radius:var(--radius-lg); background:var(--bg-100); box-shadow:var(--shadow); }
.card.plot:hover { transform:translateY(-2px); box-shadow:var(--shadow); }
.card.plot .cover { position:relative; inset:auto; height:auto; aspect-ratio:3/4; padding-bottom:0; flex:none; }
.card.plot .cover .cimg { width:100%; height:100%; object-fit:cover; object-position:center; }
.card.plot .pbody { position:static; display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding:20px; background:none; flex:1; }
.card.plot .pbody h3 { margin:0; font-size:22px; line-height:30px; text-shadow:none; color:var(--text-100); }
.card.plot .syn { margin:0; color:var(--text-200); font-size:14px; line-height:22px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.card.plot .ptag { display:block; width:fit-content; max-width:100%; box-sizing:border-box; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; height:22px; padding:0 8px; border-radius:var(--radius-sm); border:1px solid var(--line-200); color:var(--text-200); font:500 12px/20px var(--font-sans); }
.card.plot .pmeta { width:100%; margin-top:auto; padding-top:4px; color:var(--text-300); font-size:12px; }
.card.plot .pplug { color:var(--warning); }
@media (max-width:720px) {
  main:has(.cats-row), main:has(.disc-head) { padding-left:16px; padding-right:16px; }
  main:has(.cats-row) .grid, main:has(.disc-head) .grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .cats-row { margin:0 -16px 16px; padding:8px 16px; }
  .section-heading { gap:4px; margin-bottom:16px; } .section-heading h2 { font-size:22px; line-height:30px; } .section-heading p { width:100%; font-size:13px; }
  .card.plot .pbody { padding:12px; gap:4px; }
  .card.plot .pbody h3 { font-size:17px; line-height:24px; }
  .card.plot .syn { font-size:13px; line-height:20px; -webkit-line-clamp:1; }
  .card.plot .ptag { display:none; }
}

/* 页脚 */
.sitefoot { border-top:1px solid var(--line-100); color:var(--text-300); font-size:13px; }
.sf-in { max-width:1280px; margin:0 auto; padding:24px 40px; display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; }
.sf-links { display:flex; gap:24px; flex-wrap:wrap; } .sf-links a { color:var(--text-200); text-decoration:none; } .sf-links a:hover { color:var(--text-100); text-decoration:underline; text-underline-offset:4px; }
body.chatpage .sitefoot, body.immersive .sitefoot { display:none; }
.msearch { display:none; }
@media (max-width:720px) { .msearch { display:inline-grid; } .sf-in { padding:20px 16px calc(84px + env(safe-area-inset-bottom)); } .sf-links { gap:16px; } }
@media (max-width:720px) { header .langbox { display:none; } header .userbox { margin-left:auto; } body:not(.hide-lang) header .langbox { display:flex; margin-left:6px; } header .userbox .whobtn.guest { display:none; } }      /* 手机游客：顶栏右上角放语言选择，不放「登录」（登录从底部「我的」进） */
#qrow:not([hidden]) { margin-bottom:12px; }
#qrow:not([hidden]) + .hero-v1 { margin-top:0; }

/* 发现页 */
.disc-head { padding:8px 0 28px; } .disc-head h1 { margin:0 0 8px; font-size:clamp(28px,4vw,40px); line-height:1.25; } .disc-head p { margin:0; }
.disc-creators { margin-top:56px; }
.list-rows { display:flex; flex-direction:column; }
.list-row.ccard { flex-direction:row; align-items:center; gap:16px; width:auto; padding:16px 12px; border-radius:0; border:0; border-bottom:1px solid var(--line-100); background:none; box-shadow:none; text-align:left; }
.list-row.ccard:hover { transform:none; background:var(--bg-100); }
.list-row .cav { width:64px; height:64px; border-radius:var(--radius-md); margin:0; font-size:26px; flex:none; }
.list-row .lr-main { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; text-align:left; }
.list-row .lr-main b { font-size:16px; } .list-row .lr-main small { color:var(--text-300); font-size:13px; white-space:normal; }
.list-row .lr-go { flex:none; color:var(--text-300); }
@media (max-width:720px) { .disc-creators { margin-top:36px; } .list-row .cav { width:56px; height:56px; } }
.list-row .cav { overflow:hidden; } .list-row .cav img { width:100%; height:100%; object-fit:cover; }

/* 个人中心 */
.profile-head { display:flex; align-items:center; gap:24px; flex-wrap:wrap; margin:0 0 40px; padding:0; border:0; background:none; box-shadow:none; }
.profile-head .cav { width:96px; height:96px; border-radius:50%; overflow:hidden; display:grid; place-items:center; font-size:40px; font-weight:600; color:#fff; flex:none; background:linear-gradient(135deg,hsl(var(--h) 60% 45%),hsl(calc(var(--h) + 48) 55% 30%)); }
.profile-head .cav img { width:100%; height:100%; object-fit:cover; }
.profile-head .ph-main { flex:1; min-width:220px; }
.profile-head h1 { margin:0 0 6px; font-size:32px; line-height:42px; }
.profile-head p { margin:0 0 12px; }
.profile-head .stats { display:flex; gap:28px; }
.profile-head .stats div { display:flex; flex-direction:column; gap:2px; } .profile-head .stats b { font-size:20px; line-height:28px; } .profile-head .stats span { font-size:12px; color:var(--text-300); }
.profbtns { display:flex; align-items:center; gap:12px; }
.textbtn { border:0; background:none; color:var(--brand-text); padding:0 4px; } .textbtn:hover { background:none; text-decoration:underline; text-underline-offset:4px; }
.profile-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:48px; }
.list-row { display:flex; width:100%; align-items:center; gap:16px; padding:16px; min-height:64px; border:0; border-bottom:1px solid var(--line-100); border-radius:0; background:transparent; color:var(--text-100); text-align:left; font-weight:400; }
.list-row:hover { background:var(--bg-100); }
.list-row .label { flex:1; min-width:0; } .list-row .label strong { font-weight:500; display:block; font-size:15px; } .list-row .label small { display:block; margin-top:4px; font-size:12px; line-height:18px; color:var(--text-300); }
.list-row .lr-val { color:var(--text-300); font-size:14px; }
.list-row .unread { min-width:18px; height:18px; padding:0 5px; border-radius:9px; background:var(--danger); color:var(--on-brand); font-size:11px; font-weight:700; display:grid; place-items:center; }
.profile-out { margin-top:16px; padding-left:12px; }
@media (max-width:720px) { .profile-head { gap:16px; } .profile-head .cav { width:72px; height:72px; font-size:30px; } .profile-head h1 { font-size:24px; line-height:32px; } .profile-grid { display:block; } .profile-grid > div + div { margin-top:32px; } .profbtns { width:100%; } }
.profbtns { flex:0 0 auto; margin-top:0; } .profbtns button { flex:none; padding:0 20px; height:44px; } .profbtns .textbtn { padding:0 4px; height:auto; }
@media (max-width:720px) { .profbtns { flex:1 0 100%; } }

/* 对话列表 / 收藏：列表行 */
main:has(.disc-head) .libhead h3 { font-family:var(--font-serif); font-size:22px; }
.libhead a { color:var(--brand-text); font-weight:600; cursor:pointer; }
.list-item { border:0; border-bottom:1px solid var(--line-100); border-radius:0; background:transparent; box-shadow:none; margin:0; padding:16px 8px; position:relative; flex-wrap:wrap; }
.list-item:hover { transform:none; background:var(--bg-100); border-color:var(--line-100); }
.list-item .avatar { width:56px; height:56px; border-radius:var(--radius-md); overflow:hidden; }
.list-item .textbtn { flex:none; font-size:13px; }
.list-item small.muted { order:3; }
.ftile .fcov { border-radius:var(--radius-md); box-shadow:none; }
.empty { color:var(--text-300); } .empty b { filter:grayscale(1); opacity:.55; }

/* 创建页：工作室标题 + 胶囊页卡 */
.ph-row { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.ph-row h1 { margin-bottom:8px; }
.ph-row .primary { height:44px; padding:0 22px; border-radius:999px; flex:none; }
.kindtabs.big { gap:8px; margin:0 0 16px; padding-bottom:12px; }
.kindtabs.big button { font-size:14px; font-weight:600; padding:0 16px; height:36px; color:var(--text-200); background:transparent; border:1px solid var(--line-200); border-radius:999px; }
.kindtabs.big button.on, .kindtabs.big button.active { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); }
.filterrow .tabs button { border:1px solid var(--line-200); }
.mine-item { border:0; border-bottom:1px solid var(--line-100); border-radius:0; background:transparent; margin:0; padding:16px 8px; }
.mine-item:hover { transform:none; background:var(--bg-100); border-color:var(--line-100); }
.mine-item .ico { border-radius:var(--radius-md); background:var(--bg-300); }
.mnew { display:none; }

/* AI 向导：步骤条 / 选项卡片按 Yume UI v1 */
.wiz { background:var(--bg-000); }
.dots { gap:6px; }
.dot { min-width:0; width:28px; height:4px; padding:0; border:0; border-radius:2px; font-size:0; color:transparent; background:var(--line-200); }
.dot.done { background:var(--brand); }
.dot.cur { width:auto; height:28px; padding:0 14px; font-size:13px; font-weight:600; color:var(--brand-text); background:var(--brand-soft); box-shadow:none; border-radius:999px; }
.dl { display:none; }
.bubble { background:var(--bg-200); border:0; font-family:var(--font-serif); font-weight:600; }
.bubble::after { background:var(--bg-200); border:0; }
.blob { background:radial-gradient(circle at 35% 28%,#e6fff8 0 14%,#7ee0c8 46%,#3fb89c 100%); box-shadow:inset 0 -6px 12px rgba(6,35,29,.3),0 10px 24px rgba(126,224,200,.28); }
.blob i { background:#06231d; } .blob b { border-bottom-color:#06231d; }
.wopt, .wcard { border-radius:var(--radius-md); background:var(--bg-100); border:1px solid var(--line-200); }
.wopt:hover, .wcard:hover { background:var(--bg-300); }
.wopt:has(input:checked), .wcard.sel { border-color:var(--brand); background:var(--brand-soft); }
.wopt b, .wcard b { font-weight:600; }
.wiz-foot { background:var(--bg-000); border-top:1px solid var(--line-100); }
.wiz-foot button { height:52px; border-radius:999px; }
@media (min-width:900px) { .wiz-in { max-width:720px; } }

/* 聊天页：气泡 / 旁白 / 输入框按 Yume UI v1（不动结构） */
body.chatpage .chat { background:var(--bg-000); }
@media (min-width:721px) { body.chatpage .chat { border:0; border-radius:0; } }
.chat-head { background:var(--bg-000); backdrop-filter:none; border-bottom:1px solid var(--line-100); }
.chat-head b { font-family:var(--font-serif); font-weight:600; font-size:18px; }
.msg { font-size:16px; line-height:26px; padding:10px 14px; border-radius:var(--radius-md); box-shadow:none; }
.msg.assistant { background:var(--bg-200); border:0; border-top-left-radius:4px; box-shadow:none; }
.msg.user { border-top-right-radius:4px; }
.nar { color:var(--text-300); font-style:normal; }
.msg img { box-shadow:none; }
.inputbar { background:var(--bg-000); backdrop-filter:none; border-top:1px solid var(--line-100); }
.inwrap { border-radius:var(--radius-md); background:var(--bg-100); border:1px solid var(--line-100); }
.inwrap:focus-within { border-color:var(--line-200); box-shadow:none; }
.inwrap.preparing { background:var(--bg-100); }
.freebtn { background:var(--brand-soft); } .freebtn b { color:var(--brand-text); }
.inputbar > button { background:var(--brand); border:0; color:var(--on-brand); }
.inputbar > button:hover { background:var(--brand-hover); }
.inputbar > button:disabled { background:var(--bg-300); color:var(--text-400); }
/* 聊天页修正：输入框自带圆角焦点态，去掉全局的方形焦点框；旁白用正体 */
.inwrap textarea:focus, .inwrap textarea:focus-visible, .inwrap input:focus-visible { outline:none; }
.inwrap:focus-within { border-color:var(--brand); }
.msg em, .msg .nar, .narr, .nar { font-style:normal; }
.act, .env, .seg.narr, .ob-nar { font-style:normal; }
.env, .ob-nar { font-family:var(--font-serif); color:var(--text-200); }
.act { color:var(--text-300); }
/* 插件提示条 / 插件标签：橙色统一成品牌青绿 */
.pl-lock { background:var(--brand-soft); border:1px solid color-mix(in srgb,var(--brand) 35%,transparent); color:var(--text-100); }
.pl-lock .lk-btn { background:var(--brand); color:var(--on-brand); }
.pl-chips button { background:transparent; border-color:var(--line-200); color:var(--text-100); }
.pl-chips button.on { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); }
.card.plot .pplug { color:var(--brand-text); }

/* 登录注册：无卡片，左对齐，和原型一致 */
.auth { max-width:420px; margin:4vh auto 0; padding:8px 4px 24px; border:0; border-radius:0; background:none; box-shadow:none; }
.auth .brand { text-align:left; margin-bottom:28px; }
.auth .brand .logo { display:flex; align-items:center; gap:12px; font-size:28px; }
.auth .brand-img.lg { width:48px; height:48px; }
.auth h2 { text-align:left; margin:0 0 20px; font-size:32px; line-height:42px; }
.auth button.primary { height:48px; border-radius:999px; }
.auth input { height:48px; border-radius:var(--radius-md); }

/* 弹窗 */
dialog { background:var(--bg-200); color:var(--text-100); border:0; border-radius:var(--radius-lg); padding:24px; box-shadow:0 12px 32px rgba(0,0,0,.45); }
dialog::backdrop { background:rgba(5,8,16,.7); }
dialog h3 { font-size:20px; line-height:28px; margin:0 0 12px; }
.typecards button, .choose .cc { border-radius:var(--radius-md); border:1px solid var(--line-200); background:transparent; }
.typecards button:hover { background:var(--bg-300); }
/* 登录页：页面里已有大 logo，隐藏顶栏的重复 logo */
body:has(form.auth) header .logo { display:none; }

/* 创作者主页头部：和个人中心一致的扁平样式 */
.mehead { padding:0; border:0; border-radius:0; background:none; box-shadow:none; gap:24px; margin-bottom:32px !important; }
.mehead .cav { width:96px; height:96px; font-size:40px; font-weight:600; }
.mehead h2 { font-size:28px; line-height:38px; margin-bottom:4px !important; }
.mehead .profbtns { flex:0 0 auto; }
@media (max-width:720px) { .mehead { gap:16px; } .mehead .cav { width:72px; height:72px; font-size:30px; } .mehead h2 { font-size:24px; line-height:32px; } .mehead .profbtns { flex:1 0 100%; } }

/* 编辑器：外层卡片压平，表单直接铺在页面上 */
#aed { background:none !important; border:0 !important; box-shadow:none !important; padding:0 !important; }

/* 剧本杀：橙红 / 紫色渐变统一成品牌青绿 */
.flag.vn, .pp-chips .vnchip { background:var(--brand); color:var(--on-brand); }
.vp-dice { background:var(--brand); color:var(--on-brand); }
.vp-m.mine { background:var(--brand); color:var(--on-brand); }
.bar i { background:var(--brand); }
.endcard { background:var(--brand-soft); border:1px solid color-mix(in srgb,var(--brand) 35%,transparent); }
.vp-ch:hover { background:rgba(126,224,200,.22); }

/* 子页头部：返回 + 衬线标题 */
.ic { width:1.15em; height:1.15em; vertical-align:-.2em; flex:none; }      /* 线性图标（shared/core/dom.js 的 ICON_*）：大小跟着按钮字号走 */
.sub-bar { position:sticky; top:0; z-index:10; margin:0 -16px; padding:6px 16px; background:var(--bg); } .sub-bar .back { display:inline-flex; align-items:center; gap:4px; margin:0; padding:6px 4px; font-size:14px; }      /* 二级页（排行 / 屏蔽管理 / 语言）的返回按钮：固定在页面顶部，列表滚动时不跟着走 */
.sub-head { padding:0 0 20px; } 
.sub-head h1 { margin:0; font-size:clamp(26px,4vw,36px); }
/* 设置类列表：actrows 改成带分隔线的列表行 */
.actrows { gap:0; margin:0; }
.actrows button { border:0; border-bottom:1px solid var(--line-100); border-radius:0; background:transparent; padding:16px; font-weight:500; min-height:56px; }
.actrows button:hover { background:var(--bg-100); }

/* 运营后台：导航 / 表格 / 卡片对齐新风格 */
.opsnav button { height:36px; padding:0 16px; border:1px solid var(--line-200); border-radius:999px; background:transparent; color:var(--text-200); font-weight:600; font-size:14px; }
.opsnav button:hover { color:var(--text-100); background:transparent; }
.opsnav button.active { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); }
.opshead h2, .admpage h2 { font-family:var(--font-serif); font-size:26px; line-height:36px; margin:0; }
.optable { background:var(--bg-100); border-radius:var(--radius-md); box-shadow:var(--shadow); }
.optable th { color:var(--text-300); font-size:12px; letter-spacing:.04em; background:var(--bg-200); }
.optable td, .optable th { border-bottom:1px solid var(--line-100); }
.optable tbody tr:hover, .ptbl tbody tr:hover, .prtbl tbody tr:hover { background:var(--bg-300); }
.optable button { height:28px; padding:0 12px; }
.badge { background:var(--brand-soft); color:var(--brand-text); border:0; font-weight:600; }
.adm-login { background:var(--bg-100); border:0; border-radius:var(--radius-lg); box-shadow:var(--shadow); }

/* 剧情详情页：上方「封面 + 信息 + 操作」，下方「正文 + 侧栏」（Yume UI v1 版式） */
.pp-main h1 { font-family:var(--font-serif); font-size:clamp(28px,3.4vw,40px); line-height:1.25; margin-bottom:12px; }
.pp-syn { font-weight:400; font-size:16px; line-height:26px; color:var(--text-200); }
.pp-h { font-family:var(--font-serif); font-weight:600; font-size:22px; line-height:30px; margin:36px 0 16px; }
.pp-bmain > .pp-h:first-child, .pp-bmain > :first-child .pp-h, .pp-aside > .pp-h:first-child { margin-top:0; }
.pp-char { border:0; border-bottom:1px solid var(--line-100); border-radius:0; background:transparent; padding:14px 4px; }
.pp-cast { gap:0; }
.pp-chips span { border-radius:var(--radius-sm); border:1px solid var(--line-200); background:transparent; }
@media (min-width:900px) {
  .pp { max-width:1200px; grid-template-columns:420px minmax(0,1fr); gap:48px 56px; }
  .pp-cover { position:relative; max-height:none; border-radius:var(--radius-lg); }
  .pp-body { grid-column:1 / -1; display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:56px; }
  .pp-bar { position:static; background:none !important; border:0; padding:0; margin-top:24px; backdrop-filter:none !important; -webkit-backdrop-filter:none !important; }
  .pp-bar-in { max-width:none; padding-left:0; flex-direction:row-reverse; justify-content:flex-end; gap:12px; }
  .pp-bar button { height:48px; border-radius:999px; }
  .pp-bar .primary { flex:none; padding:0 32px; }
  .pp-bar #ppgo, .pp-bar #ppcont { flex:none; padding:0 32px; font-size:16px; } .pp-bar #ppgo { order:1; } .pp-bar #ppcont { order:2; }      /* 这里整排是反向的：继续上次排最左，其次开启新对话，收藏在最右 */
  .pp-bar .favbtn { width:48px; border:1px solid var(--line-200); background:transparent; color:var(--brand-text); font-size:20px; }
}
@media (max-width:899px) { .pp-body { display:block; padding:0 16px; } .pp-aside { margin-top:8px; } }

/* 聊天页：自选对话区间生成画面 */
.msgs.pick-mode .msg.pick { cursor:pointer; opacity:.7; }
.msgs.pick-mode .msg.picked { opacity:1; box-shadow:0 0 0 2px var(--brand); }
.pickbar { position:absolute; left:0; right:0; bottom:0; z-index:40; display:flex; align-items:center; gap:12px; padding:12px 16px calc(12px + env(safe-area-inset-bottom)); background:var(--bg-000); border-top:1px solid var(--line-100); }
.pickbar .pk-n { flex:1; min-width:0; font-size:13px; color:var(--text-200); }
.pickbar button { height:44px; padding:0 18px; border-radius:999px; flex:none; }
.pickbar .pk-p { margin-left:4px; opacity:.85; font-weight:500; }
.scenepick button { display:flex; flex-direction:column; align-items:flex-start; gap:2px; height:auto; padding:12px 16px; border-radius:var(--radius-md); text-align:left; }
.scenepick button small { font-weight:400; opacity:.8; }

/* 聊天页：宽屏三栏（对话列表 | 聊天 | 角色资料），窄屏只显示聊天 */
.chat-shell { display:block; }
.chat-history, .chat-profile { display:none; }
@media (min-width:1180px) {
  body.chatpage main { max-width:1560px; }
  .chat-shell { display:grid; grid-template-columns:280px minmax(0,840px) 320px; gap:24px; justify-content:center; align-items:start; }
  .chat-history, .chat-profile { display:block; position:sticky; top:16px; max-height:calc(100dvh - 32px); overflow-y:auto; padding:8px 4px; min-width:0; scrollbar-width:none; }
  .chat-history h3, .chat-profile h3 { font-family:var(--font-serif); font-size:22px; line-height:30px; margin:0 0 16px; }
  .chat-history .list-row { padding:12px 8px; gap:12px; min-height:64px; }
  .chat-history .list-row .avatar { width:44px; height:44px; flex:none; border-radius:var(--radius-md); overflow:hidden; }
  .chat-history .list-row.is-current { background:var(--bg-100); border-radius:var(--radius-md); border-bottom-color:transparent; }
  .chat-history .feature-links { padding:12px 8px; }
  .chat-profile > img { width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:var(--radius-lg); margin-bottom:20px; }
  .chat-profile .cp-av { width:96px; height:96px; border-radius:50%; overflow:hidden; margin-bottom:16px; }
  .chat-profile p { margin:0 0 16px; font-size:14px; line-height:22px; display:-webkit-box; -webkit-line-clamp:4; -webkit-box-orient:vertical; overflow:hidden; }
}
.snap-fail { align-self:flex-start; max-width:86%; padding:12px 16px; border-radius:var(--radius-md); background:var(--bg-200); color:var(--danger); font-size:14px; }

/* 首页卡片密度：Web 一行 6 个（H5 保持一行 2 个，用上面的手机样式）；只作用在首页的主列表，横向滚动的分区行不变 */
@media (min-width:721px) {
  main:has(.cats-row) .grid:not(.hrow) { grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; }
  main:has(.cats-row) .grid:not(.hrow) .card.plot .pbody { padding:12px; gap:4px; }
  main:has(.cats-row) .grid:not(.hrow) .card.plot .pbody h3 { font-size:16px; line-height:22px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
  main:has(.cats-row) .grid:not(.hrow) .card.plot .syn { font-size:12px; line-height:18px; }
  main:has(.cats-row) .grid:not(.hrow) .card.plot .pmeta { font-size:11px; gap:4px; }
}
@media (min-width:721px) and (max-width:1023px) { main:has(.cats-row) .grid:not(.hrow) { grid-template-columns:repeat(4,minmax(0,1fr)); } }      /* 平板宽度 6 个太挤，用 4 个 */

/* 对话里「生成视频」的档位弹窗：每张卡片左边档位名 + 「时长 · 说明」，右边点数胶囊；默认档高亮 */
dialog .vidwrap { min-width:min(300px,78vw); }
dialog .vidpick { display:grid; gap:12px; margin:16px 0; }
dialog .vidpick .vidtier { display:flex; flex-direction:row; align-items:center; justify-content:space-between; gap:14px; width:100%; height:auto; min-height:0; padding:16px 20px; text-align:left; border-radius:20px; border:1px solid var(--line-200); background:var(--bg-300); color:var(--text-100); box-shadow:none; }
dialog .vidpick .vidtier:hover { border-color:var(--brand); background:var(--bg-300); }
dialog .vidpick .vidtier.primary { border-color:transparent; background:var(--brand); color:var(--on-brand); box-shadow:var(--shadow-brand); }
dialog .vidpick .vidtier .vt-main { display:flex; flex-direction:column; align-items:flex-start; gap:4px; min-width:0; flex:1; text-align:left; }
dialog .vidpick .vidtier .vt-main b { display:block; font-size:19px; line-height:1.25; font-weight:700; }
dialog .vidpick .vidtier .vt-main small { display:block; font-size:14px; line-height:1.35; font-weight:400; opacity:.85; }
dialog .vidpick .vidtier .vt-price { flex:none; padding:8px 18px; border-radius:999px; background:rgba(127,127,127,.2); font-size:16px; font-weight:700; white-space:nowrap; color:inherit; }
dialog .vidpick .vidtier.primary .vt-price { background:rgba(0,0,0,.14); }

/* 安卓手机浏览器顶部的「下载 App」横幅（web/src/components/app-banner.js）：图标 + 名称 + 一句话 + 关闭，下面两个按钮 */
#appbanner { background:var(--bg-200); color:var(--text-100); padding:14px 16px 16px; border-bottom:1px solid var(--line-100); }
#appbanner .ab-top { display:flex; align-items:center; gap:12px; }
#appbanner .ab-icon { width:48px; height:48px; border-radius:12px; flex:none; object-fit:cover; }
#appbanner .ab-text { flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
#appbanner .ab-text b { font-size:17px; line-height:1.25; font-weight:700; }
#appbanner .ab-text small { font-size:13px; line-height:1.35; color:var(--text-300, var(--muted)); }
#appbanner .ab-x { flex:none; width:36px; height:36px; padding:0; border:0; background:transparent; color:var(--text-300, var(--muted)); font-size:18px; border-radius:50%; }
#appbanner .ab-btns { display:flex; gap:10px; margin-top:12px; }
#appbanner .ab-btns a { flex:1; display:flex; align-items:center; justify-content:center; min-width:0; min-height:44px; padding:6px 10px; line-height:1.25; border-radius:999px; font-size:14px; font-weight:700; text-decoration:none; text-align:center; }
#appbanner .ab-play { background:var(--brand); color:var(--on-brand); border:1px solid transparent; }
#appbanner .ab-apk { background:transparent; color:var(--brand-text, var(--brand)); border:1px solid var(--brand); }

/* iOS Safari：输入框字号小于 16px 时，点进去页面会被自动放大，而且不会自己缩回来——整页变宽，发送按钮、气泡被挤出屏幕。iOS 上输入框一律 16px */
@supports (-webkit-touch-callout:none) {
  input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]), textarea, select { font-size:16px !important; }
}

/* 手机上「开始创作」是右下角的圆形加号按钮（拇指够得着的位置），浮在底部导航上方；电脑上仍在标题右边的文字按钮 */
@media (max-width:720px) {
  .ph-row #newplot { position:fixed; right:16px; bottom:calc(64px + env(safe-area-inset-bottom) + 16px); z-index:20; width:56px; height:56px; padding:0; border-radius:50%; box-shadow:0 8px 24px rgba(0,0,0,.4); display:grid; place-items:center; }
  .ph-row #newplot .np-t { display:none; }
  .ph-row #newplot::before { content:'＋'; font-size:30px; font-weight:400; line-height:1; }
}

.vcard .vredo { position:absolute; left:10px; top:10px; padding:6px 12px; border-radius:999px; border:0; font-size:12.5px; font-weight:600; background:rgba(0,0,0,.55); color:#fff; backdrop-filter:blur(6px); }      /* 视频卡片左上角（右上角是删除，底部是播放条）：按要求重新生成 */

/* 对话输入框（参考主流角色扮演平台）：上面是输入区，下面一排工具按钮：* 加动作标记、/ 更多操作、✦ 帮我写，发送在最右 */
.inputbar { align-items:stretch; }
.inwrap { flex-direction:column; align-items:stretch; gap:2px; padding:8px 10px 8px 12px; border-radius:20px; }
.inwrap textarea { padding:6px 2px; min-height:40px; }
.inwrap .prep { top:22px; transform:none; }
.intools { display:flex; align-items:center; gap:8px; }
.itool { position:relative; width:36px; height:36px; padding:0; flex:none; border-radius:50%; border:1px solid var(--line-200, var(--border)); background:var(--bg-100, var(--card)); color:var(--text-300, var(--muted)); font-size:17px; display:grid; place-items:center; }
.itool:hover { color:var(--text-100, var(--fg)); border-color:var(--line-300, var(--accent2)); }
.itool.freebtn { color:var(--brand-text, var(--accent2)); background:var(--brand-soft, var(--card)); padding:0; gap:0; height:36px; border-radius:50%; }
.itool.freebtn b { display:none; } .itool.freebtn span { font-size:17px; }
.intools #send { margin-left:auto; width:44px; height:36px; padding:0; border-radius:12px; font-size:15px; }
.slashwrap { position:relative; display:inline-flex; }
.slashmenu { position:absolute; left:0; bottom:calc(100% + 8px); min-width:150px; padding:6px; border-radius:14px; background:var(--card); border:1px solid var(--border); box-shadow:0 12px 32px rgba(0,0,0,.4); z-index:30; display:flex; flex-direction:column; gap:2px; }
.slashmenu[hidden] { display:none; }
.slashmenu button { display:flex; align-items:center; gap:10px; width:100%; padding:9px 12px; border:0; border-radius:10px; background:transparent; text-align:left; font-size:14.5px; }
.slashmenu button:hover { background:var(--bg-200, var(--card2)); } .slashmenu i { font-style:normal; width:20px; text-align:center; }

/* 候选发言：左边 ✎ 放进输入框改一改，右边 ↑ 直接发送 */
.sg-row { display:flex; align-items:stretch; gap:8px; }
.sg-row .sg-item { flex:1; min-width:0; }
.sg-edit, .sg-go { flex:none; width:44px; padding:0; border-radius:14px; background:var(--card); border:1px solid var(--border); color:var(--muted); font-size:16px; display:grid; place-items:center; }
.sg-edit:hover, .sg-go:hover { color:var(--fg); border-color:var(--accent2); }

/* ===== 卡片上的举报 / 屏蔽入口、内容分级标签、社区提示（UGC 审核要求：首页就能看到） ===== */
.card.plot { position:relative; }
.card.plot .pmore { position:absolute; top:8px; right:8px; z-index:6; width:30px; height:30px; padding:0; border-radius:50%; border:0; background:rgba(0,0,0,.45); color:#fff; font-size:18px; line-height:1; letter-spacing:1px; backdrop-filter:blur(4px); cursor:pointer; display:grid; place-items:center; }
.card.plot .pmore:hover { background:rgba(0,0,0,.65); }
.ugc-note { margin:0 0 14px; font-size:12.5px; line-height:1.7; color:var(--text-300); }
.ugc-note a { color:var(--text-200); text-decoration:underline; text-underline-offset:2px; }

/* 手机上对话页更紧凑：一屏多放一些字（字号 16→15、行高 26→23、气泡内边距和段间距收小，气泡更宽） */
@media (max-width:720px) {
  .msgs { padding:12px 10px 8px; gap:10px; }
  .msg { max-width:94%; font-size:15px; line-height:23px; padding:8px 12px; }
  .msg .act { font-size:14px; line-height:21px; margin:0 0 2px; }
  .msg .who { margin-bottom:2px; }
  .seg { margin:0 0 8px; }
  .seg.narr { padding:6px 10px; }
  .chat-head { padding:8px 12px; }
}

/* 对话列表：预览最多两行；「继续」是主按钮，删除收进「⋯」 */
.list-item .chlast { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-width:none; }
.list-item .chcont { flex:none; padding:8px 18px; border-radius:999px; font-size:14px; }
.list-item .chmore { flex:none; width:32px; height:32px; padding:0; border-radius:50%; font-size:18px; line-height:1; color:var(--text-300); }
.list-item small.muted { order:0 !important; }
.tagrow button.on { background:var(--brand-soft); border-color:transparent; color:var(--brand-text); }
/* 候选发言：可以收起成一行标题；手机上最多占屏幕高度的 30% */
.sugg.fold > :not(.sg-head) { display:none !important; }
.sugg .sg-head button#sgfold { font-size:16px; line-height:1; }
@media (max-width:720px) { .sugg { max-height:30vh; } }
.card.plot:focus-visible { outline:2px solid var(--brand); outline-offset:2px; }

/* 「插件」页卡的展开：标题、简介、玩法名称显示完整 */
.card.plot .pexp { margin:0; padding:2px 10px; height:24px; border-radius:12px; border:1px solid rgba(255,255,255,.22); background:rgba(255,255,255,.08); color:var(--brand-text,#7ee0c8); font-size:12px; cursor:pointer; }
main .card.plot.open .pbody h3 { display:block; -webkit-line-clamp:unset; overflow:visible; }
main .card.plot.open .pbody .syn { display:block; -webkit-line-clamp:unset; overflow:visible; }
main .card.plot.open .pbody .pplug { white-space:normal; overflow:visible; text-overflow:clip; line-height:1.6; }