/* ============================================================
   MYF Phone — 1080×2388 设计舞台 等比缩放
   严格按设计稿坐标、字体、颜色、透明度还原
   ============================================================ */

* { margin:0; padding:0; box-sizing:border-box; -webkit-tap-highlight-color:transparent; }

:root{
  --serif:"Noto Serif SC","Source Han Serif CN","Songti SC","SimSun",serif;
  --script:"Great Vibes",cursive;
  --script2:"Roboto","Source Han Serif CN",serif;
  --ink:#000000;
  --ink2:#656565;
}

html,body{
  width:100%; height:100%;
  background:#111;
  font-family:var(--serif);
  overflow:hidden;
  color:var(--ink);
}

#device{
  position:fixed; inset:0;
  display:flex; align-items:center; justify-content:center;
}
#stage{
  position:relative;
  width:1080px; height:2388px;
  flex:0 0 auto;
  transform-origin:center center;
}

/* —— 页面 —— */
.screen{
  position:absolute; inset:0;
  width:1080px; height:2388px;
  background:#fff;
  overflow:hidden;
  display:none;
}
.screen.active{ display:block; }
/* Q001 应用商店：唯一允许垂直滚动的页面
   结构（3 层，都在 #Q001 内）：
     1) .q001-fixed-head    头部（flex:0 0 auto，绝对不滚）
     2) .q001-scroll-body   应用列表 frame（flex:1 1 auto，overflow-y:auto，只装行/线）
     3) .q001-add           "+" 按钮（absolute 钉底部，永远不滚，不在 frame 里） */
#Q001{
  overflow:hidden !important;
  display:none;
  flex-direction:column;
}
#Q001.active{ display:flex !important; }
/* 头部：flex:0 0 auto，物理上不可能被滚走 */
#Q001 .q001-fixed-head{
  flex:0 0 auto;
  width:1080px;
  height:181px;             /* appbar(180) + 1px 分割线 */
  position:relative;
  background:#fff;
  z-index:5;
}
/* 应用列表 frame：占据头部下方的全部可用空间，唯一可滚动
   注意：flex 子项必须加 min-height:0，否则无法收缩到可用高度，
   容器会被内容撑出屏幕外，导致永远滚不动 */
#Q001 .q001-scroll-body{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  width:1080px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  /* 第一行原来紧贴头部下沿：行是绝对定位、基准 top:0，正好落在 181px 头的正下方，一点缝都没有。
     绝对定位子项的包含块是 padding box —— 加 padding 顶不开它们，但加 border 会把 padding box
     整体下移，于是内置 5 行和用户自装的 #q001-extra（也是 top:0 绝对定位）一起让出这段间距。 */
  border-top:44px solid transparent;
  /* frame 视觉边界（可选，让"列表区"更清晰可见；不依赖描边也能感知滚动范围） */
  /* border:1px solid #f0f0f0; */
}
.hidden{ display:none !important; }
img{ -webkit-user-drag:none; user-select:none; }
button{ font-family:inherit; }

/* ============================================================
   A001 / A002 登录注册
   ============================================================ */
.auth-bg{
  position:absolute; inset:0;
  background:url('assets/img/login-bg.webp') center/cover no-repeat;
}
.auth-switch{
  position:absolute; top:60px; left:924px; width:100px; height:72px;
  background:transparent; border:none; outline:none;
  font-size:50px; color:#656565; text-align:center;
  font-family:var(--serif);
  cursor:pointer; padding:0;
}
.auth-title{
  position:absolute; top:528px; left:110px; width:861px; height:100px;
  font-family:var(--script2);
  font-style:italic;
  font-weight:250;
  font-size:100px; line-height:100%;
  color:#000000;
  -webkit-text-stroke:1px #000000;
  text-align:justify;
  display:flex; align-items:center;
  letter-spacing:0;
}
.auth-input{
  position:absolute; left:90px; width:900px; height:120px;
  border-radius:20px;
  background:rgba(255,255,255,0.3);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  box-shadow:2px 4px 0 rgba(101,101,101,0.5);
  overflow:hidden;
}
.auth-input input{
  width:100%; height:100%; border:none; outline:none; background:transparent;
  font-family:var(--serif); font-size:45px; color:#000000;
  padding-left:30px;
}
.auth-input input::placeholder{ color:#656565; }
.auth-submit{
  position:absolute; top:1356px; left:347px; width:387px; height:140px;
  border-radius:20px;
  background:rgba(255,255,255,0.3);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  border:1px solid #656565;
  display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}
.auth-submit span{ font-size:60px; color:#000000; }

/* ============================================================
   A003 主屏幕
   ============================================================ */
.card-bg{
  position:absolute; inset:0;
  background:linear-gradient(137deg,
    #ffffff 0%,
    #a6a6a6 18%,
    #ffffff 50%,
    #7f7f7f 63%,
    #ffffff 100%);
}
.a003-toptext{
  position:absolute; top:101px; left:91px;
  font-size:42px; color:#000000;
}
.a003-divider{
  position:absolute; top:174px; left:91px; width:900px; height:0;
  border-top:4px solid #656565;
}
.character-card-wrap{
  position:absolute; top:325px; left:90px; width:900px; height:1600px;
  border:1px solid #000000; overflow:hidden; cursor:pointer;
}
.character-card-img{
  width:100%; height:100%; object-fit:cover; object-position:center;
}
.a003-intro{
  position:absolute; top:1380px; left:90px; width:900px; height:216px;
  background:linear-gradient(90deg,#ffffff 0%,#ababab 52.7%,rgba(255,255,255,0) 100%);
}
.a003-intro-side{
  position:absolute; top:0; left:-40px; width:40px; height:216px;
  background:#5e6394;
}
.a003-intro-sub{
  position:absolute; top:0; left:40px; font-size:38px; color:#000000;
}
.a003-intro-name{
  position:absolute; top:55px; left:40px; font-size:50px; color:#000000;
}
.a003-intro-desc{
  position:absolute; top:127px; left:40px; font-size:50px; color:#656565;
}
.a003-mode{
  position:absolute; top:1925px; left:91px; width:900px; height:128px;
  background:linear-gradient(90deg,#ffffff 0%,#bebebe 50%,#ffffff 100%);
  backdrop-filter:blur(50px);
  -webkit-backdrop-filter:blur(50px);
}
.a003-mode-item{
  position:absolute; top:35px; font-size:40px; color:#000000; cursor:pointer;
  text-align:center; height:57px; line-height:57px;
}
.a003-mode-item:nth-child(1){ left:48px; }
.a003-mode-item:nth-child(2){ left:263px; }
.a003-mode-item:nth-child(3){ left:478px; }
.a003-mode-item:nth-child(4){ left:693px; }
.a003-mode-item.active{ border-bottom:3px solid #000000; }
.a003-jump{
  position:absolute; top:2154px; left:90px; width:900px; height:160px;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}

/* ============================================================
   A004 角色卡背面（全部用屏幕绝对坐标）
   ============================================================ */
.a004-card{
  position:absolute; top:325px; left:90px; width:900px; height:1600px;
  background:#ffffff; border:1px solid #000000; border-radius:10px;
  box-shadow:8px 8px 10px rgba(0,0,0,0.25);
}
.a004-photo{
  position:absolute; top:460px; left:351px; width:379px; height:674px;
  object-fit:cover; border:1px solid #000000; cursor:pointer;
}
.a004-replace{
  position:absolute; top:380px; left:850px; width:80px; height:80px;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.a004-label{
  position:absolute; left:190px; font-size:50px; color:#000000; font-weight:600;
  line-height:1;
}
.a004-line{
  position:absolute; left:340px; width:540px; height:50px; border:none; outline:none;
  font-size:50px; font-family:var(--serif); color:#000000; background:transparent;
  line-height:1;
}
.a004-line::placeholder{ color:#999999; }
.a004-rule{
  position:absolute; left:190px; width:700px; height:0; border-top:1px solid #000000;
}
.a004-done{
  position:absolute; top:1632px; left:490px; width:100px; height:100px;
  cursor:pointer;
}

/* ============================================================
   公共标题栏（A005 / Q系列）
   ============================================================ */
.appbar{
  position:absolute; top:0; left:0; width:100%; height:180px;
}
.appbar-back{
  position:absolute; left:42px; top:71px; width:100px; height:100px;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.appbar-title{
  position:absolute; top:96px; left:770px; width:220px; height:55px;
  font-size:55px; font-weight:700; color:#000000; text-align:right;
  line-height:1;
}
/* A005 标题与 Q 系列不同：靠左 + 不带返回箭头 */
.appbar-title.a005-title{ left:430px; text-align:left; }
/* A005 顶部右侧：当前「我」——点一下换人（A005 没有返回箭头，右边这块本来是空的） */
.a005-user{
  position:absolute; top:71px; left:660px; width:380px; height:100px;
  display:flex; align-items:center; justify-content:flex-end; gap:14px;
  padding:0 24px; box-sizing:border-box; border-radius:50px;
  background:rgba(0,0,0,.06); cursor:pointer; font-size:38px; line-height:1;
}
.a005-user-lb{ color:#8a8a8a; font-size:32px; flex:none; }
.a005-user-nm{ font-weight:700; color:#000; max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.a005-user:active{ background:rgba(0,0,0,.13); }
.appbar-divider{
  position:absolute; top:180px; left:0; width:100%; height:0;
  border-top:1px solid #000000;
}

/* ============================================================
   A005 应用抽屉
   ============================================================ */
/* 安装的应用较多时允许整屏垂直滚动，避免图标冲出屏幕被裁掉 */
#A005{
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
.a005-app{
  position:absolute; width:100px; height:140px;
  display:flex; flex-direction:column; align-items:center; cursor:pointer;
}
.a005-app img{ width:100px; height:100px; }
.a005-app-name{
  position:absolute; top:123px; width:150px; text-align:center;
  font-size:38px; color:#656565; white-space:nowrap;
  transform:translateX(-50%); left:50%;
}
.a005-bottom-divider{
  position:absolute; top:2080px; left:0; width:100%; height:0;
  border-top:1px solid #000000;
}
.a005-jump{
  position:absolute; top:2126px; left:90px; width:900px; height:160px;
  cursor:pointer; display:flex; align-items:center; justify-content:center;
}

/* ============================================================
   Q001 应用商店首页
   ============================================================ */
.q001-row{
  position:absolute; left:0; width:100%; height:152px;
  cursor:pointer;
}
.q001-icon{
  position:absolute; top:0; left:92px; width:100px; height:100px;
}
.q001-name{
  position:absolute; top:0; left:224px; font-size:50px; color:#000000;
}
.q001-desc{
  position:absolute; top:82px; left:224px; font-size:38px; color:#000000;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  max-width:500px;
}
.q001-code{
  position:absolute; top:27px; left:770px; width:64px; height:64px; cursor:pointer;
}
.q001-action{
  position:absolute; top:25px; left:880px; width:152px; height:88px;
  border-radius:20px; border:4px solid #000000;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.q001-action span{ font-size:45px; font-weight:700; }
/* 安装：白底黑字 */
.q001-action.install{ background:#ffffff; }
.q001-action.install span{ color:#000000; }
/* 更新：淡黄底黑字 */
.q001-action.update{ background:#FFF8D0; }
.q001-action.update span{ color:#000000; }
/* 卸载：黑底白字 */
.q001-action.uninstall{ background:#000000; }
.q001-action.uninstall span{ color:#ffffff; }

.q001-line{
  position:absolute; left:0; width:100%; height:0;
  border-top:2px solid #000000;
}
.q001-add{
  /* "+" 按钮：固定到 #Q001 最底部（不在 frame 里，永远不动）
     用 absolute + bottom 钉在屏幕底部，水平居中
     z-index 高于 scroll-body，避免被列表行遮挡 */
  position:absolute;
  left:67px;
  bottom:60px;
  width:150px; height:150px;
  z-index:10;
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
/*
  用户自装应用容器：
  - 容器本身定位在 top:0，不做任何偏移！
    （行的绝对坐标 1410+ 由 JS 统一计算，若容器再偏移一次会双重叠加）
  - 高度由 JS 按内容设置，用于撑开滚动区
*/
#q001-extra{
  position:absolute;
  left:0; top:0;
  width:100%;
  height:0;
  pointer-events:none;
}
#q001-extra .q001-row,#q001-extra .q001-line{ pointer-events:auto; }
/* 自定义滚动条样式：让 Q001 滚动看起来更"原生" */
.q001-scroll-body::-webkit-scrollbar{ width:12px; }
.q001-scroll-body::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.35); border-radius:6px; }
.q001-scroll-body::-webkit-scrollbar-track{ background:transparent; }

/* ============================================================
   Q002 新增应用
   ============================================================ */
.q002-method{
  position:absolute; top:256px; width:400px; height:136px;
  border-radius:50px; background:#d9d9d9; border:4px solid #656565;
  display:flex; align-items:center; justify-content:center; gap:18px;
  cursor:pointer;
}
.q002-method span{ font-size:50px; color:#000000; }
.q002-method img{ width:64px; height:64px; }
.q002-prompt-label{
  position:absolute; top:454px; left:40px;
  font-size:38px; color:#656565;
}
.q002-send{
  position:absolute; top:428px; left:959px; width:64px; height:64px;
  background:none; border:none; cursor:pointer; display:flex;
}
.q002-prompt{
  position:absolute; top:512px; left:40px; width:1000px; height:388px;
  border:1px solid #000000; border-radius:20px; background:#ffffff;
  padding:34px 32px; font-size:45px; font-family:var(--serif);
  color:#000000; resize:none; outline:none; line-height:1.5;
}
.q002-prompt::placeholder{ color:#656565; }
.q002-code{
  position:absolute; top:1028px; left:40px; width:1000px; height:1045px;
  border:1px solid #000000; border-radius:20px; background:#ffffff;
  padding:43px 32px; font-size:36px; font-family:ui-monospace,Menlo,Consolas,monospace;
  color:#000000; resize:none; outline:none; line-height:1.5;
}
.q002-code::placeholder{ color:#656565; font-family:var(--serif); }
.q002-test{
  position:absolute; top:2182px; left:380px; width:320px; height:88px;
  border-radius:20px; background:#000000; color:#ffffff;
  font-size:50px; display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}

/* ============================================================
   Q003 / Q004 共用背景
   ============================================================ */
.q003-bg{
  position:absolute; inset:0;
  background:linear-gradient(180deg,#656565 0%,#ffffff 100%);
}
.q003-switch{
  position:absolute; top:235px; left:926px; width:80px; height:80px;
  display:flex; align-items:center; justify-content:center; cursor:pointer;
}
.q003-icon-box{
  position:absolute; top:297px; left:112px; width:180px; height:180px;
  border-radius:36px; background:transparent;
  border:1.5px solid #cccccc; overflow:visible; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.q003-icon-box img{ width:120px; height:120px; display:block; }
.q003-change{
  position:absolute; top:297px; left:462px; font-size:50px; color:#656565;
}
.q003-src{
  position:absolute; top:379px; left:462px; font-size:38px; color:#656565;
  max-width:500px; word-break:break-all; line-height:1.4;
}
.q003-key{
  position:absolute; left:92px; font-size:50px; font-weight:600; color:#000000;
  line-height:1;
}
.q003-val{
  position:absolute; left:362px; width:580px; height:50px; border:none; outline:none;
  font-size:46px; font-family:var(--serif); color:#000000; background:transparent;
  line-height:1;
}
.q003-rule{
  position:absolute; left:362px; width:600px; height:0; border-top:2px solid #000000;
}
.q003-desc-label{
  position:absolute; left:92px; font-size:50px; font-weight:600; color:#000000;
  line-height:1;
}
.q003-desc{
  position:absolute; top:1205px; left:90px; width:900px; height:604px;
  font-size:42px; line-height:1.55; color:#656565; outline:none;
  overflow-y:auto;
}
.q003-desc:focus{ background:rgba(255,255,255,.4); }
.q003-share{
  position:absolute; top:2167px; left:380px; width:320px; height:88px;
  border-radius:20px; background:#000000; color:#ffffff;
  font-size:50px; display:flex; align-items:center; justify-content:center;
  cursor:pointer;
}

/* ============================================================
   Q004
   ============================================================ */
.q004-icon{
  position:absolute; top:250px; background:none; border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
#q004-undo{ left:114px; }
#q004-save{ left:220px; }
.q004-code{
  position:absolute; top:334px; left:40px; width:1000px; height:1766px;
  border:1px solid #000000; border-radius:20px; background:#ffffff;
  padding:40px 32px; font-size:34px; font-family:ui-monospace,Menlo,Consolas,monospace;
  color:#020202; resize:none; outline:none; line-height:1.5;
}
.q004-test{ top:2167px; }

/* ============================================================
   插件运行
   ============================================================ */
.plugin-frame{
  position:absolute; top:180px; left:0; width:100%; height:2208px;
  border:none; background:#ffffff;
}

/* ============================================================
   功能测试弹窗
   ============================================================ */
.modal{
  position:fixed; inset:0; z-index:50;
  background:rgba(0,0,0,.5);
  display:flex; align-items:center; justify-content:center;
}
.modal-card{
  width:90vmin; height:88vh; max-width:540px; max-height:880px;
  background:#fff; border-radius:20px; overflow:hidden;
  display:flex; flex-direction:column;
}
.modal-head{
  height:56px; display:flex; align-items:center; justify-content:space-between;
  padding:0 20px; border-bottom:1px solid #eee; font-size:20px;
}
#test-close{
  border:none; background:none; font-size:30px; cursor:pointer; color:#888;
}
.test-frame{ flex:1; width:100%; border:none; background:#fff; }
.modal-foot{ height:64px; display:flex; align-items:center; justify-content:center; border-top:1px solid #eee; }
.q002-install{
  width:260px; height:48px; border-radius:24px; border:none;
  background:#000000; color:#ffffff; font-size:18px; cursor:pointer;
}

/* ============================================================
   toast
   ============================================================ */
#toast{
  position:fixed; left:50%; bottom:12%; transform:translateX(-50%);
  background:rgba(0,0,0,.82); color:#fff; padding:14px 26px;
  border-radius:30px; font-size:16px; z-index:60;
  transition:opacity .25s;
}

/* ============================================================
   设置插件（S001~S008，按 Pixso B001~B008 设计稿）
   颜色全部走 CSS 变量，夜间模式只需切 :root.dark
   ============================================================ */
:root{
  --s-bg:#ffffff;      /* 屏背景 */
  --s-ink:#000000;     /* 主文字 */
  --s-ink2:#656565;    /* 次要文字 / 分隔线 */
  --s-card:#ffffff;    /* 白卡片 / 输入框 */
  --s-card2:#d9d9d9;   /* 灰卡片 / 灰底 */
  --s-line:#000000;    /* 头部分隔线 */
  --s-btn:#000000;     /* 黑按钮 */
  --s-btnTxt:#ffffff;
}
:root.dark{
  --s-bg:#161616;
  --s-ink:#e8e8e8;
  --s-ink2:#9a9a9a;
  --s-card:#242424;
  --s-card2:#333333;
  --s-line:#555555;
  --s-btn:#000000;
  --s-btnTxt:#ffffff;
}

/* —— 通用头部 —— */
.s-head{ position:absolute; top:0; left:0; width:100%; height:181px; }
.s-back{ position:absolute; top:71px; left:42px; width:100px; height:100px; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.s-title{ position:absolute; top:96px; left:880px; width:110px; height:55px; font-size:55px; font-weight:700; color:var(--s-ink); text-align:right; line-height:1; white-space:nowrap; }
.s-divider{ position:absolute; top:180px; left:0; width:100%; height:0; border-top:1px solid var(--s-line); }

/* —— 通用菜单行 —— */
.s-row{ position:absolute; left:90px; width:902px; height:80px; cursor:pointer; }
.s-row-txt{ position:absolute; top:0; left:30px; font-size:50px; font-weight:600; color:var(--s-ink); line-height:80px; white-space:nowrap; }
.s-row-val{ position:absolute; top:20px; left:621px; max-width:250px; font-size:38px; color:var(--s-ink2); line-height:1; outline:none; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.s-row-chev{ position:absolute; top:10px; left:870px; width:60px; height:60px; }
.s-row-line{ position:absolute; top:80px; left:-14px; width:900px; height:0; border-top:1px solid var(--s-ink2); }
#S001 .s-row-line{ border-top-width:2px; }   /* B001 主列表分隔线 2px，子页 1px */

.s-brand{ position:absolute; top:2193px; left:464px; font-size:38px; color:var(--s-ink); }

/* —— S001 底部：调试总开关（一行小字） ——
   和 .s-brand 同一列左缘（464），排在它上面；小一号、灰一点，不抢设置项的存在感。
   「开着」时用主题色，一眼能看出当前是开是关。 */
.s-dbg{
  position:absolute; top:2100px; left:464px; font-size:34px; line-height:1;
  color:#9a9a9a; cursor:pointer; user-select:none;
}
.s-dbg.on{ color:#8b5e3c; }
.s-dbg:active{ opacity:.6; }

/* —— 夜间模式开关（SVG：右钮=开，off 时水平翻转） —— */
.s-toggle{ position:absolute; top:8px; left:774px; width:128px; height:64px; cursor:pointer; }
.s-toggle img{ transition:transform .25s; }
.s-toggle.off img{ transform:scaleX(-1); }

/* ============================================================
   S002 账号
   ============================================================ */
.s2-profile{ position:absolute; top:180px; left:0; width:1080px; height:750px; overflow:hidden; cursor:pointer; }
.s2-bg{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.s2-avatar{ position:absolute; top:300px; left:420px; width:240px; height:240px; border-radius:50%; overflow:hidden; cursor:pointer; }
.s2-avatar img{ width:100%; height:100%; object-fit:cover; }
.s2-name{ position:absolute; top:584px; left:0; width:1080px; text-align:center; font-size:50px; font-weight:700; color:var(--s-ink); outline:none; }
.s2-logout{ position:absolute; top:1800px; left:380px; width:320px; height:88px; border-radius:20px; background:var(--s-btn); color:var(--s-btnTxt); display:flex; align-items:center; justify-content:center; cursor:pointer; }
.s2-logout span{ font-size:50px; font-weight:600; }

/* ============================================================
   S003 API
   ============================================================ */
.s3-scroll{ position:absolute; top:330px; left:90px; width:900px; height:2058px; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
.s3-scroll::-webkit-scrollbar{ width:12px; }
.s3-scroll::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.35); border-radius:6px; }
.s3-sec{ position:relative; font-size:50px; font-weight:600; color:var(--s-ink); line-height:1; }
.s3-card{ position:relative; width:900px; height:1694px; background:var(--s-card2); border-radius:10px; margin-top:30px; }
.s3-sec2{ margin-top:134px; }                 /* 语音标题位于 1908 */
.s3-card-voice{ height:2185px; }              /* 语音卡片更高 */
/* ⚠ 往 .s3-fields 加字段必须把下面三块一起 +154（见 .s3-fields 那段注释）。
   这次语音卡从 5 个字段变 6 个（补了缺失的 base，另加 voice）→ 全部 +154。 */
.s3-card-voice .s3-btns{ top:1063px; }
.s3-card-voice .s3-sepline{ top:1250px; }
.s3-card-voice .s3-configs{ top:1338px; }
/* ⚠ .s3-fields 是绝对定位、随内容长高；下面 .s3-btns / .s3-sepline / .s3-configs / .s3-relay
   全是写死的 top。往 .s3-fields 里加一个 .s3-field，整块就长高 154px（90 高 + 64 下边距），
   加完必须把下面几块一起 +154，否则新输入框会压在「添加配置/保存配置」按钮上。
   当前 5 个字段：102 起，102+5×154 = 872 结束；.s3-btns 从 909 起（留 37px 缝）。 */
.s3-fields{ position:absolute; top:102px; left:105px; width:689px; }
.s3-field{ position:relative; height:90px; margin-bottom:64px; }
.s3-field input{ width:100%; height:90px; border:none; outline:none; background:var(--s-card); border-radius:50px; padding:0 48px; font-size:38px; font-family:var(--serif); color:var(--s-ink); }
.s3-field input::placeholder{ color:var(--s-ink2); }
.s3-btns{ position:absolute; top:909px; left:105px; width:689px; height:107px; }
.s3-btn{ position:absolute; top:0; width:299px; height:107px; border-radius:20px; background:var(--s-btn); color:var(--s-btnTxt); font-size:50px; font-weight:600; display:flex; align-items:center; justify-content:center; cursor:pointer; }
.s3-btn:nth-child(1){ left:0; }
.s3-btn:nth-child(2){ left:390px; }
.s3-sepline{ position:absolute; top:1096px; left:-1px; width:902px; height:0; border-top:1px solid var(--s-ink2); }
.s3-configs{ position:absolute; top:1184px; left:105px; width:689px; height:510px; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
.s3-cfg{ position:relative; width:689px; height:210px; background:var(--s-card); border-radius:50px; margin-bottom:62px; cursor:pointer; }
.s3-cfg.on{ box-shadow:0 0 0 3px var(--s-ink); }
.s3-cfg-name{ position:absolute; top:39px; left:59px; font-size:50px; font-weight:600; color:var(--s-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:440px; }
.s3-cfg-link{ position:absolute; top:126px; left:59px; font-size:38px; color:var(--s-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:440px; }
.s3-cfg-del{ position:absolute; top:73px; left:567px; width:64px; height:64px; cursor:pointer; }
/* --- 追加：生图卡片 + 模型列表（点右侧刷新图标拉取，或填好URL+密钥失焦后自动拉取） --- */
.s3-sec3{ margin-top:134px; }                 /* 生图标题接在语音卡片之后 */
.s3-card-image{ height:1694px; }              /* 生图卡片与通用卡片同高 */
.s3-field-pick input{ padding-right:150px; }  /* 给右侧图标留位 */
.s3-pick{ position:absolute; top:13px; right:22px; width:64px; height:64px; cursor:pointer; opacity:.55; }
.s3-pick:hover{ opacity:1; }
/* 下拉列表：浮在字段下方，压住下面那格与按钮区，选完即收 */
.s3-models{ display:none; position:absolute; top:100px; left:0; width:100%; max-height:520px; overflow-y:auto;
  background:var(--s-card); border-radius:30px; box-shadow:0 12px 40px rgba(0,0,0,.28); z-index:5; padding:14px 0; }
.s3-models.on{ display:block; }
.s3-models::-webkit-scrollbar{ width:10px; }
.s3-models::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.3); border-radius:5px; }
.s3-models-hd{ padding:10px 48px 18px; font-size:30px; color:var(--s-ink2); }
.s3-models-msg{ padding:26px 48px; font-size:32px; color:var(--s-ink2); line-height:1.5; }
.s3-models-msg.busy{ color:var(--s-ink); }
.s3-model{ padding:22px 48px; font-size:38px; color:var(--s-ink); cursor:pointer;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.s3-model:hover, .s3-model:active{ background:rgba(0,0,0,.07); }

/* ============================================================
   S004 美化
   ============================================================ */
.s4-sec{ position:absolute; left:90px; width:900px; height:500px; }
.s4-title{ position:absolute; top:0; left:30px; font-size:50px; font-weight:600; color:var(--s-ink); line-height:1; }
/* 「一键清空」：替掉原来那两行说明文字（缩略图 / 可作为相纸），做成可点的动作 */
.s4-clear{ position:absolute; top:0; right:0; font-size:32px; color:var(--s-ink2); cursor:pointer;
  border-bottom:1px solid var(--s-ink2); line-height:1.2; padding-bottom:4px; }
.s4-clear:active{ color:#D5382B; border-color:#D5382B; }
.s4-strip{ position:absolute; top:180px; left:0; width:900px; height:320px; overflow-x:auto; overflow-y:hidden; white-space:nowrap; -webkit-overflow-scrolling:touch; }
.s4-strip::-webkit-scrollbar{ height:8px; }
.s4-strip::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.3); border-radius:4px; }
.s4-item{ position:relative; display:inline-block; width:180px; height:320px; margin-right:60px; vertical-align:top; overflow:hidden; }
.s4-item.add{ background:var(--s-card2); cursor:pointer; }
.s4-item.add img{ position:absolute; top:120px; left:50px; width:80px; height:80px; }
.s4-item.thumb{ cursor:pointer; }
.s4-item.thumb img{ width:180px; height:320px; object-fit:cover; }
.s4-item.thumb .sel{ position:absolute; top:0; left:0; width:100%; height:100%; border:6px solid var(--s-ink); display:none; box-sizing:border-box; }
.s4-item.thumb.on .sel{ display:block; }
.s4-css{ position:absolute; top:1684px; left:90px; width:900px; height:441px; background:var(--s-card2); border-radius:10px; }
.s4-css textarea{ width:100%; height:100%; border:none; outline:none; background:transparent; resize:none; padding:51px 59px; font-size:35px; font-family:var(--serif); color:var(--s-ink); line-height:1.6; }
.s4-css textarea::placeholder{ color:var(--s-ink2); }
.s4-brand{ top:2220px; }

/* ============================================================
   S005 库管理
   ============================================================ */
.s5-row{ position:absolute; left:0; width:1080px; height:68px; cursor:pointer; }
.s5-row span{ position:absolute; top:0; left:122px; font-size:50px; font-weight:600; color:var(--s-ink); line-height:68px; white-space:nowrap; }
.s5-row img{ position:absolute; top:-11px; left:962px; width:60px; height:60px; }
.s5-line{ position:absolute; top:68px; left:92px; width:900px; height:0; border-top:1px solid var(--s-ink2); }
.s5-add{ position:absolute; bottom:60px; left:492px; width:100px; height:100px; cursor:pointer; z-index:10; }
/* S005 库总览：固定头(181px)下方滚动区 + 动态行撑高(仿 Q001 .q001-scroll-body) */
#S005 .s5-scroll{
  position:absolute; top:181px; left:0; width:1080px; bottom:0;
  overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch;
}
#S005 .s5-scroll::-webkit-scrollbar{ width:12px; }
#S005 .s5-scroll::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.35); border-radius:6px; }
#S005 .s5-scroll::-webkit-scrollbar-track{ background:transparent; }
#s5-extra{ position:relative; left:0; top:0; width:1080px; height:0; pointer-events:none; }
#s5-extra .s5-row{ pointer-events:auto; }
/* 库行角标：显示库里包含的文件数量（不再标文字/图片 —— 用户反馈没信息量）。
   位置贴着右侧的箭头图标、和它垂直对齐（箭头在 left:962 y:-11~49）。 */
.s5-type{ position:absolute; top:4px; right:130px; font-size:24px; line-height:1;
  padding:6px 14px; border-radius:16px; background:var(--s-card2); color:var(--s-ink2);
  border:none; pointer-events:none; }
/* 自定义库的删除 ✕（排在数量角标和箭头之间） */
.s5-del{ position:absolute; right:212px; top:50%; margin-top:-24px; width:48px; height:48px;
  display:flex; align-items:center; justify-content:center; font-size:36px; color:var(--s-ink2); cursor:pointer; z-index:2; }

/* ============================================================
   S006 库内列表
   ============================================================ */
.s6-title{ left:458px; width:165px; text-align:center; }
.s6-add{ position:absolute; top:71px; left:946px; width:88px; height:88px; cursor:pointer; display:flex; align-items:center; justify-content:center; }
.s6-card{ position:absolute; top:270px; left:90px; width:900px; height:2010px; background:var(--s-card2); border-radius:10px; }
.s6-scroll{ position:absolute; top:97px; left:105px; width:689px; height:1853px; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; }
.s6-scroll::-webkit-scrollbar{ width:12px; }
.s6-scroll::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.35); border-radius:6px; }
.s6-file{ position:relative; width:689px; height:210px; background:var(--s-card); border-radius:50px; margin-bottom:62px; cursor:pointer; }
.s6-file-name{ position:absolute; top:39px; left:59px; font-size:50px; font-weight:600; color:var(--s-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:440px; }
.s6-file-tags{ position:absolute; top:126px; left:59px; font-size:38px; color:var(--s-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; max-width:440px; }
.s6-file-del{ position:absolute; top:73px; left:567px; width:64px; height:64px; cursor:pointer; }
/* S006 批量导入 chip + 浮层（仅商品库） */
.s6-import{ position:absolute; top:74px; left:640px; height:72px; padding:0 26px;
  display:none; align-items:center; justify-content:center;
  background:var(--s-btn); color:var(--s-btnTxt); border-radius:36px;
  font-size:28px; font-weight:600; cursor:pointer; white-space:nowrap; z-index:5; }
.s6-import.on{ display:flex; }
.s6-imp-mask{ position:absolute; inset:0; z-index:40; display:none;
  align-items:center; justify-content:center; background:rgba(0,0,0,.45); }
.s6-imp-mask.on{ display:flex; }
.s6-imp-card{ width:880px; max-height:1750px; background:var(--s-card); border:1px solid var(--s-ink);
  border-radius:20px; padding:40px 40px 34px; display:flex; flex-direction:column;
  box-shadow:0 20px 60px rgba(0,0,0,.3); }
.s6-imp-title{ font-size:44px; font-weight:700; color:var(--s-ink); }
.s6-imp-hint{ margin-top:12px; font-size:26px; line-height:1.6; color:var(--s-ink2); }
.s6-imp-text{ margin-top:22px; width:100%; height:820px; border:1px solid var(--s-ink2);
  border-radius:10px; padding:20px 24px; font-size:28px;
  font-family:ui-monospace,Menlo,Consolas,monospace; color:var(--s-ink);
  background:var(--s-card); resize:none; outline:none; line-height:1.7; }
.s6-imp-err{ min-height:36px; margin-top:10px; font-size:26px; color:#DD0404; }
.s6-imp-btns{ margin-top:16px; display:flex; justify-content:flex-end; gap:24px; }
.s6-imp-btn{ height:88px; padding:0 44px; border-radius:44px; display:flex;
  align-items:center; justify-content:center; font-size:36px; font-weight:600; cursor:pointer; }
.s6-imp-btn.ghost{ background:var(--s-card2); color:var(--s-ink); }
.s6-imp-btn.primary{ background:var(--s-btn); color:var(--s-btnTxt); }
/* S006 图片库卡片：左侧缩略图 + 右侧文本（覆盖上面绝对定位布局） */
.s6-file.s6-img{ display:flex; align-items:center; gap:24px; padding:22px 30px; }
.s6-file.s6-img .s6-file-name,
.s6-file.s6-img .s6-file-tags{ position:static; max-width:360px; }
.s6-file.s6-img .s6-file-del{ position:absolute; top:73px; left:567px; }
.s6-file.s6-img .s6-thumb{ position:absolute; top:24px; left:28px; width:162px; height:162px; border-radius:24px; object-fit:cover; background:#d9d9d9; display:flex; align-items:center; justify-content:center; }
.s6-file.s6-img .s6-fn-wrap{ position:absolute; top:0; left:216px; width:330px; height:210px; display:flex; flex-direction:column; justify-content:center; gap:10px; }
.s6-file.s6-img .s6-fn-wrap .s6-file-name{ position:static; font-size:42px; }
.s6-file.s6-img .s6-fn-wrap .s6-file-tags{ position:static; font-size:34px; }

/* 插件库行：图标 + 名称 + 简介 + 安装状态徽章（点击徽章切换安装/卸载，点行编辑代码） */
.s6-file.s6-plug{ cursor:pointer; }
.s6-file.s6-plug .s6-thumb{ font-size:84px; color:var(--s-ink); }
.s6-file.s6-plug .s6-fn-wrap{ width:430px; }
.s6-file.s6-plug .s6-fn-wrap .s6-file-name{ font-size:40px; max-width:290px; }
.s6-file.s6-plug .s6-fn-wrap .s6-file-tags{ font-size:30px; max-width:290px; }
.s6-file.s6-plug .s6-file-del{ display:none; }
.s6-plug-state{ position:absolute; top:76px; right:34px; padding:14px 26px; font-size:26px; line-height:1; border-radius:32px; color:#fff; cursor:pointer; white-space:nowrap; }
.s6-plug-state.off{ background:var(--s-ink2); }
.s6-plug-state.on{ background:#289800; }

/* ============================================================
   S007 编辑库里单个文件
   ============================================================ */
.s7-card{ position:absolute; top:285px; left:40px; width:1000px; height:2016px; background:var(--s-card); border:1px solid var(--s-ink); border-radius:10px; }
.s7-sepline{ position:absolute; top:94px; left:2px; width:1000px; height:0; border-top:1px solid var(--s-ink); }
.s7-name{ position:absolute; top:19px; left:50px; width:720px; font-size:55px; font-weight:600; color:var(--s-ink); outline:none; border:none; background:transparent; padding:0; font-family:inherit; }
.s7-name::placeholder{ color:var(--s-ink2); font-weight:400; }
.s7-author{ position:absolute; top:34px; left:830px; width:150px; font-size:38px; color:var(--s-ink); text-align:right; outline:none; border:none; background:transparent; padding:0; font-family:inherit; }
.s7-author::placeholder{ color:var(--s-ink2); }
.s7-tags{ position:absolute; top:119px; left:30px; width:940px; font-size:38px; color:var(--s-ink); outline:none; border:none; background:transparent; padding:0; font-family:inherit; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.s7-tags::placeholder{ color:var(--s-ink2); }
.s7-content{ position:absolute; top:208px; left:30px; width:940px; height:1372px; }
.s7-content textarea{ width:100%; height:100%; border:none; outline:none; background:transparent; resize:none; font-size:42px; font-family:var(--serif); color:var(--s-ink); line-height:1.9; overflow-y:auto; }
.s7-content textarea::placeholder{ color:var(--s-ink2); }
/* 图片类库的「选图」：钉在内容框右下角，别盖住正文（正文在左边写） */
.s7-pickimg{ position:absolute; right:12px; bottom:12px; display:none; flex-direction:column;
  align-items:center; gap:6px; padding:16px 20px; border:2px dashed var(--s-ink2);
  border-radius:20px; cursor:pointer; font-size:26px; color:var(--s-ink2); background:rgba(255,255,255,.86); }
.s7-pickimg img{ opacity:.55; }
.s7-pickimg:active{ transform:scale(.96); }
.s7-line{ position:absolute; top:1640px; left:0; width:1000px; height:0; border-top:1px solid var(--s-ink); }
.s7-modes{ position:absolute; top:1676px; left:82px; }
.s7-mode{ position:relative; display:inline-block; margin-right:50px; font-size:45px; font-weight:600; color:var(--s-ink); cursor:pointer; line-height:45px; padding-left:38px; }
.s7-dot{ position:absolute; top:12px; left:0; width:20px; height:20px; border-radius:50%; }
.s7-dot.yellow{ background:#FFE506; } .s7-dot.red{ background:#DD0404; } .s7-dot.green{ background:#289800; }
.s7-mode.active .s7-dot{ box-shadow:0 0 0 4px rgba(0,0,0,.25); }
/* ---------- 重要程度 / 插入位置（重做过） ----------
   两个都做成"黑描边胶囊"，和界面其它控件同一套语言：
     · 重要程度 = 分段选择（SS~D），选中的整块反白
     · 插入位置 = 步进器「− 数值 ＋」（原来那条 6px 轨道 + 22px 滑块的 range 手机上点不准）
   高度都从 46 提到 88，手指够得着；标签宽 190，中文四字 42px 正好放下还留余量。 */
.s7-bar{ position:absolute; left:2px; width:646px; height:88px; }
#s7-imp{ top:1760px; } #s7-pos{ top:1868px; }
.s7-bar-label{ position:absolute; top:0; left:0; width:190px; font-size:42px; font-weight:600; color:var(--s-ink); text-align:right; line-height:88px; }
.s7-bar-track{ position:absolute; top:0; left:220px; width:426px; height:88px; box-sizing:border-box;
  border:2px solid var(--s-ink); border-radius:44px; background:var(--s-card); display:flex; overflow:hidden; }
.s7-bar-track span{ flex:1; text-align:center; line-height:84px; font-size:36px; font-weight:600; color:var(--s-ink); cursor:pointer; }
.s7-bar-track span + span{ border-left:1px solid var(--s-ink2); }
.s7-bar-track span.active{ background:var(--s-ink); color:var(--s-card); }
.s7-step{ position:absolute; top:0; left:220px; width:426px; height:88px; box-sizing:border-box;
  border:2px solid var(--s-ink); border-radius:44px; background:var(--s-card); display:flex; align-items:stretch; overflow:hidden; }
.s7-step-btn{ width:112px; display:flex; align-items:center; justify-content:center;
  font-size:56px; font-weight:600; color:var(--s-ink); cursor:pointer; user-select:none; -webkit-user-select:none; }
.s7-step-btn:active{ background:var(--s-card2); }
.s7-step-val{ flex:1; display:flex; align-items:center; justify-content:center; font-size:48px; font-weight:700;
  color:var(--s-ink); cursor:pointer; border-left:1px solid var(--s-ink2); border-right:1px solid var(--s-ink2); }
.s7-save{ position:absolute; top:1760px; left:813px; width:118px; height:118px; cursor:pointer; }

/* ============================================================
   S008 数据
   ============================================================ */
.s8-size{ position:absolute; top:403px; left:286px; width:614px; height:243px; }
.s8-num{ position:absolute; top:43px; left:0; width:507px; font-size:200px; font-weight:600; color:var(--s-ink); text-align:center; line-height:1; white-space:nowrap; }
.s8-unit{ position:absolute; top:0; left:529px; font-size:50px; font-weight:600; color:var(--s-ink); }
.s8-btn{ position:absolute; top:16px; left:848px; width:48px; height:48px; cursor:pointer; }
.s8-path{ position:absolute; top:1561px; left:190px; width:700px; font-size:38px; color:var(--s-ink2); text-align:center; line-height:1.9; outline:none; }

/* —— 空状态占位 —— */
.s3-empty{ padding:40px 0; text-align:center; font-size:38px; color:var(--s-ink2); }
.s6-empty{ padding:40px 0; text-align:center; font-size:38px; color:var(--s-ink2); }

/* ============================================================
   夜间模式 —— 宿主全局深色主题
   ============================================================ */
:root.dark body{ color:#e8e8e8; }
:root.dark .screen{ background:#161616; }
:root.dark .q001-fixed-head{ background:#161616; }
/* 登录/注册 */
:root.dark .auth-title{ color:#e8e8e8; -webkit-text-stroke:1px #e8e8e8; }
:root.dark .auth-input input{ color:#e8e8e8; }
:root.dark .auth-input input::placeholder{ color:#9a9a9a; }
:root.dark .auth-submit span{ color:#e8e8e8; }
:root.dark .auth-switch{ color:#9a9a9a; }
/* 主屏 A003 / 角色卡 A004 */
:root.dark .card-bg{ background:linear-gradient(137deg,#2a2a2a 0%,#1a1a1a 18%,#242424 50%,#161616 63%,#222 100%); }
:root.dark .a003-toptext{ color:#e8e8e8; }
:root.dark .a003-divider{ border-top-color:#555; }
:root.dark .a003-intro{ background:linear-gradient(90deg,#262626 0%,#333 52.7%,rgba(38,38,38,0) 100%); }
:root.dark .a003-intro-sub, :root.dark .a003-intro-name{ color:#e8e8e8; }
:root.dark .a003-intro-desc{ color:#9a9a9a; }
:root.dark .a003-mode{ background:linear-gradient(90deg,#1a1a1a 0%,#333 50%,#1a1a1a 100%); }
:root.dark .a003-mode-item{ color:#e8e8e8; }
:root.dark .a004-card{ background:#242424; border-color:#555; }
:root.dark .a004-label{ color:#e8e8e8; }
:root.dark .a004-line{ color:#e8e8e8; }
:root.dark .a004-line::placeholder{ color:#666; }
:root.dark .a004-rule{ border-top-color:#666; }
/* 标题栏 / 抽屉 */
:root.dark .appbar-title{ color:#e8e8e8; }
:root.dark .a005-app-name{ color:#9a9a9a; }
:root.dark .a005-bottom-divider{ border-top-color:#555; }
/* Q001 商店 */
:root.dark .q001-name, :root.dark .q001-desc{ color:#e8e8e8; }
:root.dark .q001-line{ border-top-color:#555; }
:root.dark .q001-action{ border-color:#888; }
:root.dark .q001-action.install{ background:#242424; }
:root.dark .q001-action.install span{ color:#e8e8e8; }
:root.dark .q001-action.update{ background:#4a4410; }
:root.dark .q001-action.update span{ color:#e8e8e8; }
/* Q002 / Q003 / Q004 */
:root.dark .q003-bg{ background:linear-gradient(180deg,#333 0%,#161616 100%); }
:root.dark .q002-method{ background:#333; border-color:#666; }
:root.dark .q002-method span{ color:#e8e8e8; }
:root.dark .q002-prompt-label{ color:#9a9a9a; }
:root.dark .q002-prompt, :root.dark .q002-code, :root.dark .q004-code{ background:#242424; color:#e8e8e8; border-color:#555; }
:root.dark .q002-prompt::placeholder, :root.dark .q002-code::placeholder{ color:#9a9a9a; }
:root.dark .q003-key, :root.dark .q003-change, :root.dark .q003-desc-label{ color:#e8e8e8; }
:root.dark .q003-val{ color:#e8e8e8; }
:root.dark .q003-rule{ border-top-color:#666; }
:root.dark .q003-src, :root.dark .q003-desc{ color:#9a9a9a; }
:root.dark .q003-desc:focus{ background:rgba(255,255,255,.05); }
/* 功能测试弹窗 */
:root.dark .modal-card{ background:#242424; }
:root.dark .modal-head{ border-bottom-color:#444; color:#e8e8e8; }
:root.dark .test-frame{ background:#242424; }
/* 深色模式下需要反色成浅色的黑色线条图标 */
:root.dark .appbar-back img, :root.dark .s-back img, :root.dark .s-row-chev,
:root.dark .s6-add img, :root.dark .s5-add img, :root.dark .s8-btn,
:root.dark .s7-save img, :root.dark .s3-cfg-del img, :root.dark .s6-file-del img,
:root.dark .s4-item.add img, :root.dark .q001-code img, :root.dark .q003-switch img,
:root.dark .q004-icon img, :root.dark .a005-jump img, :root.dark .a003-jump img,
:root.dark .s3-pick,
:root.dark .s-toggle img{ filter:invert(1); }
/* 空 src 的 <img>：浏览器当成加载失败会显示碎图图标 —— 直接不显示 */
img[src=""]{ display:none; }

/* ============================================================
   追加：库管理 → 世界书库
   ============================================================ */
.s6-lore-n{ display:inline-block; margin-left:12px; padding:2px 12px; border-radius:20px;
  background:rgba(0,0,0,.08); font-size:24px; font-weight:400; }
.s6-lore-b{ display:inline-block; margin-left:10px; padding:2px 12px; border-radius:20px;
  background:rgba(139,94,60,.16); color:var(--s-ink); font-size:24px; font-weight:400; }
/* 世界书条目那一行：名称/标签收窄，角标单独摆 —— 见 app.js 里 .s6-lore 那段注释。
   位置是照着这一行的几何算的：名称/标签 x ≤359，角标 372 起，绑定按钮 380 起且垂直居中(75~135)，
   所以角标放在 y 34~74，正好错开。 */
.s6-file.s6-lore .s6-file-name{ max-width:300px; }
.s6-file.s6-lore .s6-file-tags{ max-width:300px; }
.s6-lore-meta{ position:absolute; left:372px; top:34px; display:flex; align-items:center; gap:10px;
  max-width:200px; overflow:hidden; }
.s6-lore-bind{ position:absolute; right:110px; top:50%; transform:translateY(-50%);
  padding:0 22px; height:60px; line-height:60px; border-radius:14px; border:2px solid var(--s-ink2);
  font-size:26px; cursor:pointer; }
.s6-lore-bind:active{ transform:translateY(-50%) scale(.96); }

/* ============================================================
   追加：S003 本地中转（方案 A）
   ============================================================ */
.s3-relay{ position:absolute; top:1054px; left:105px; width:689px; max-height:270px; overflow-y:auto; }
/* ⚠ 上面的 max-height 是必须的：这块的高度跟着中转里的配置条数长，
   而下面 .s3-sepline(1334) / .s3-configs(1394) 的 top 是**写死的** ——
   中转一多，chip 换行到第 3 行就会盖住分隔线和配置列表。 */
/* ⚠ 通用卡片专属：这张卡比另外两张多一块「本地中转」（.s3-relay）。
   .s3-btns 占 909~1016、.s3-sepline 在 1096 —— 中转块塞不进这 80px 的缝里，
   原来 top:700 是直接压在「保存配置」上的（「读取配置」和它重叠 99%，肉眼可见）。
   现在把中转块放到按钮行下方，再把分隔线/配置列表下移、卡片加高 250px 给它让位。
   语音卡和生图卡没有中转块，所以用 data-g="common" 限定。
   （下面三个 top 都含「名字/备注」字段那 +154，见 .s3-fields 上方的说明。） */
.s3-card[data-g="common"]{ height:1944px; }
.s3-card[data-g="common"] .s3-sepline{ top:1334px; }
.s3-card[data-g="common"] .s3-configs{ top:1394px; }
.s3-relay-hd{ font-size:30px; color:var(--s-ink2); margin-bottom:10px; }
.s3-relay-st{ margin-left:10px; font-size:26px; }
.s3-relay-st.on{ color:#2e7d32; }
.s3-relay-st.off{ color:#b23c3c; }
.s3-relay-row{ display:flex; gap:12px; align-items:center; }
.s3-relay-row input{ flex:1; height:80px; border:none; outline:none; background:var(--s-card);
  border-radius:40px; padding:0 34px; font-size:32px; color:var(--s-ink); }
.s3-btn-sm{ position:static; width:auto; height:80px; padding:0 28px; font-size:32px; border-radius:16px; }
.s3-relay-list{ margin-top:12px; font-size:26px; color:var(--s-ink2); line-height:1.5; }
.s3-relay-chip{ display:inline-block; margin:6px 12px 0 0; padding:8px 22px; border-radius:30px;
  background:var(--s-card); font-size:28px; color:var(--s-ink); cursor:pointer; }
.s3-relay-chip:active{ transform:scale(.97); }

/* ============================================================
   插件全屏模式（chrome:'none'）
   设计稿里插件页没有标题栏：iframe 占满整个 2388，返回键由插件自己在左上角画
   （透明背景，不挡设计稿）。只对声明了 chrome:'none' 的应用生效 —— 全局改会让
   其它 16 个插件失去返回入口。
   ============================================================ */
#PLUGIN.no-chrome .appbar,
#PLUGIN.no-chrome .appbar-divider{ display:none; }
#PLUGIN.no-chrome .plugin-frame{ top:0; height:2388px; }

/* ============================================================
   宿主自绘弹窗（hostModal / hostConfirm / hostAsk，见 app.js）
   复用上面的 .modal / .modal-card 全屏居中骨架，只是把卡片压小成对话框尺寸。
   原来宿主直接用浏览器原生 confirm/prompt，样式与应用完全不搭。
   ============================================================ */
.host-card{
  width:min(86vw, 460px); height:auto; max-height:80vh; overflow-y:auto;
  border-radius:20px; padding:0;
}
.host-card-body{ padding:6px 24px 4px; }
.host-card-text{ font-size:15px; line-height:1.6; color:#333; margin:8px 0 16px; }
.host-card-row{ display:block; margin-bottom:14px; }
.host-card-row > span{ display:block; font-size:13px; color:#777; margin-bottom:6px; }
.host-card-in{
  display:block; width:100%; box-sizing:border-box;
  padding:11px 13px; font-size:16px; color:#111;
  border:1.5px solid #ddd; border-radius:10px; outline:none; background:#fff;
}
.host-card-in:focus{ border-color:#111; }
.host-card-foot{ display:flex; gap:12px; padding:16px 24px 20px; }
.host-card-btn{
  flex:1; padding:12px 0; font-size:16px; border:none; border-radius:12px; cursor:pointer;
  background:#eee; color:#555;
}
.host-card-btn.ok{ background:#111; color:#fff; }
.host-card-btn:active{ transform:scale(.98); }

/* 角色库的条目是「角色卡」，不参与提示词注入 ——
   「关键词调用 / 插入位置 / 重要程度」这三块对它没有意义，在角色库里不显示。
   判定见 app.js 的 isCharLib()（在 setS7 里给 #S007 挂 .s7-charlib）。 */
#S007.s7-charlib .s7-modes,
#S007.s7-charlib #s7-imp,
#S007.s7-charlib #s7-pos{ display:none; }
/* 光隐藏会在卡片底部留下一条空白带（.s7-modes 原来占 1737~1785，卡片到 1815）。
   把腾出来的高度给内容框：角色卡本体就是一段 JSON，编辑区大点正好。
   208 + 1547 = 1755，离卡片底 1815 还有 60 —— 和原来「内容框底 1635 → 分隔线 1695」同一间距。 */
#S007.s7-charlib .s7-content{ height:1748px; }
/* 分隔线是用来把上面和下面那三块隔开的，那三块没了它也就没用了（卡片自己的边框就是分隔） */
#S007.s7-charlib .s7-line{ display:none; }

/* ============================================================
   主题系统：应用「黑体海报」主题后的 A003 海报布局 + A005 配色
   比例按参考稿：整屏 1080 宽；卡片大、互相堆叠；番茄钟是右侧大 blob；
   音乐组件是底部整条胶囊；模式入口在音乐下方，沿用同一套黑体风格。
   ============================================================ */
#A003.theme-poster > :not(.card-bg):not(#a003-poster):not(.a003-jump){ display:none; }
#A003 #a003-poster{ display:none; }
#A003.theme-poster #a003-poster{ display:block; position:absolute; inset:0; background:linear-gradient(180deg,#f4f2ef,#e9e7e3); }

#a003-poster .tp-mode{ position:absolute; top:210px; left:60px; height:130px; min-width:410px; background:#fff;
  border-radius:65px; display:flex; align-items:center; padding:0 14px 0 56px; cursor:pointer; box-shadow:0 4px 20px rgba(0,0,0,.06); }
#a003-poster .tp-mode .lbl{ font-size:52px; font-weight:700; color:#111; margin-right:38px; }
#a003-poster .tp-mode .sun{ width:104px; height:104px; border-radius:50%; background:#f5a623;
  display:flex; align-items:center; justify-content:center; font-size:56px; }
#a003-poster .tp-hello{ position:absolute; top:396px; left:60px; }
#a003-poster .tp-hello .h1{ font-size:150px; font-weight:900; color:#111; line-height:.98; letter-spacing:-2px; }
#a003-poster .tp-hello .h2{ font-size:96px; font-weight:900; color:#111; display:inline-block; border-bottom:24px solid #34a853; padding-bottom:4px; }
#a003-poster .tp-time{ position:absolute; top:780px; left:60px; font-weight:900; color:#111; font-size:200px; line-height:1; letter-spacing:-6px; }
#a003-poster .tp-time .mm{ font-size:96px; }
#a003-poster .tp-wk{ position:absolute; top:1032px; left:60px; font-size:66px; font-weight:900; color:#111; letter-spacing:2px; }
#a003-poster .tp-date{ position:absolute; top:1138px; left:60px; font-size:46px; color:#333; }
#a003-poster .tp-weather{ position:absolute; top:1240px; left:60px; height:120px; min-width:262px; padding:0 46px;
  border:3px solid #b9b6b0; border-radius:60px; display:flex; align-items:center; font-size:52px; font-weight:600; color:#222; }

/* 番茄钟（原「下班时间」）：右侧大 blob，倒计时 + 开始/暂停 */
#a003-poster .tp-blob{ position:absolute; top:190px; right:-40px; width:560px; height:716px; background:#f7f6f4;
  border-radius:46% 54% 52% 48% / 40% 44% 56% 60%; box-shadow:0 10px 36px rgba(0,0,0,.06); }
#a003-poster .tp-blob .tag{ position:absolute; top:196px; left:130px; background:#111; color:#fff; font-size:44px;
  font-weight:600; padding:18px 44px; border-radius:44px; }
#a003-poster .tp-blob .ring{ position:absolute; top:286px; left:130px; width:300px; height:300px; border-radius:50%;
  background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 20px rgba(0,0,0,.07); }
#a003-poster .tp-blob .ring span{ font-size:68px; font-weight:900; color:#111; letter-spacing:2px; }
#a003-poster .tp-blob .go{ position:absolute; top:614px; left:196px; background:#111; color:#fff; font-size:42px;
  font-weight:700; padding:20px 52px; border-radius:40px; cursor:pointer; }
#a003-poster .tp-blob .go.on{ background:#f5a623; }

/* 三张角色卡：互相堆叠（参考稿的层叠关系），不是平铺 */
#a003-poster .tp-cards{ position:absolute; top:1390px; left:-30px; width:1180px; height:500px; }
#a003-poster .tp-card{ position:absolute; width:370px; height:436px; border-radius:40px; overflow:hidden;
  box-shadow:0 14px 34px rgba(0,0,0,.13); border:8px solid rgba(255,255,255,.9); }
#a003-poster .tp-card:nth-child(1){ left:0;   top:34px;  transform:rotate(-3deg); z-index:1; }
#a003-poster .tp-card:nth-child(2){ left:355px; top:0;    transform:rotate(1.5deg); z-index:3; }
#a003-poster .tp-card:nth-child(3){ left:700px; top:36px; transform:rotate(4deg); z-index:2; }
#a003-poster .tp-card .wm{ position:absolute; top:18px; left:0; width:100%; text-align:center; font-size:62px;
  font-weight:900; color:rgba(255,255,255,.85); letter-spacing:8px; }
#a003-poster .tp-card .av{ position:absolute; top:104px; left:50%; transform:translateX(-50%); width:280px; height:240px;
  border-radius:22px; overflow:hidden; background:rgba(255,255,255,.35);
  display:flex; align-items:center; justify-content:center; font-size:130px; font-weight:900; color:rgba(0,0,0,.32); }
#a003-poster .tp-card .av img{ width:100%; height:100%; object-fit:cover; }
#a003-poster .tp-card .nm{ position:absolute; bottom:20px; left:0; width:100%; text-align:center; font-size:36px;
  font-weight:700; color:#333; }
#a003-poster .tp-card.c0{ background:#cfe3f7; } #a003-poster .tp-card.c1{ background:#e6e4df; } #a003-poster .tp-card.c2{ background:#f9dbe4; }

/* 音乐组件：底部整条胶囊（点它打开音乐 App） */
#a003-poster .tp-music{ position:absolute; top:1876px; left:60px; width:960px; height:150px; background:#fff;
  border-radius:90px; display:flex; align-items:center; padding:0 30px 0 34px; gap:30px;
  box-shadow:0 8px 28px rgba(0,0,0,.08); cursor:pointer; }
#a003-poster .tp-music .disc{ width:110px; height:110px; border-radius:50%; flex:0 0 auto;
  background:radial-gradient(circle at 50% 50%,#f26d6d 0 26%,#1c1c1c 27% 44%,#333 45% 52%,#1c1c1c 53% 100%);
  display:flex; align-items:center; justify-content:center; }
#a003-poster .tp-music .disc i{ width:24px; height:24px; border-radius:50%; background:#fff; display:block; }
#a003-poster .tp-music .tt{ flex:1; }
#a003-poster .tp-music .tt .n{ font-size:46px; font-weight:700; color:#111; }
#a003-poster .tp-music .tt .s{ font-size:32px; color:#9a9a9a; letter-spacing:3px; }
#a003-poster .tp-music .wave{ display:flex; align-items:center; gap:8px; height:56px; }
#a003-poster .tp-music .wave i{ width:10px; background:#111; border-radius:6px; display:block; }
#a003-poster .tp-music .wave i:nth-child(1){ height:20px; } #a003-poster .tp-music .wave i:nth-child(2){ height:48px; }
#a003-poster .tp-music .wave i:nth-child(3){ height:32px; }
#a003-poster .tp-music .open{ background:#111; color:#fff; font-size:38px; font-weight:700; padding:16px 38px; border-radius:50px; }

/* 模式入口：放在音乐组件下面，沿用同一套黑体 + 胶囊风格（不照搬原版的样式） */
#a003-poster .tp-modes{ position:absolute; top:2040px; left:60px; width:960px; display:flex; gap:18px; }
#a003-poster .tp-modes .m{ flex:1; height:88px; border-radius:46px; background:#fff; color:#111;
  display:flex; align-items:center; justify-content:center; font-size:32px; font-weight:700; cursor:pointer;
  box-shadow:0 4px 16px rgba(0,0,0,.05); }
#a003-poster .tp-modes .m.on{ background:#111; color:#fff; }
#a003-poster .tp-modes .m:active{ transform:scale(.98); }

#A005.theme-a5{ background:var(--a5bg,#fff); color:var(--a5ink,#111); }

/* A004（角色卡背面）跟主题走 */
#A004.theme-a4{ background:var(--a4bg,#f4f2ef); }
#A004.theme-a4 .a004-label{ color:#333; }
#A004.theme-a4 .a004-rule{ background:#d8d5d0; }

/* ============================================================
   S009 表情包库 —— 一面图墙（不套通用库界面，见 index.html 里的说明）
   ============================================================ */
.s9-cnt{ position:absolute; top:230px; left:60px; font-size:30px; color:var(--s-ink2); }
.s9-grid{
  position:absolute; top:300px; left:0; width:1080px; bottom:220px; overflow-y:auto;
  display:grid; grid-template-columns:repeat(4,1fr); gap:26px; padding:0 60px 40px; box-sizing:border-box;
}
.s9-item{ position:relative; background:#f4f4f4; border-radius:16px; overflow:hidden; cursor:pointer; }
.s9-item img{ width:100%; aspect-ratio:1/1; object-fit:contain; display:block; background:#fff; }
.s9-item .nm{ font-size:24px; line-height:1.3; padding:8px 10px 10px; color:var(--s-ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.s9-item .nm.no{ color:#c00; }             /* 还没名字/描述 → 红字提醒 */
.s9-item:active{ transform:scale(.96); }
.s9-bar{
  position:absolute; bottom:0; left:0; width:1080px; height:200px;
  display:flex; align-items:center; justify-content:center; gap:26px;
}
.s9-btn{
  height:92px; padding:0 34px; border-radius:46px; border:3px solid var(--s-ink);
  display:flex; align-items:center; font-size:32px; color:var(--s-ink); cursor:pointer; white-space:nowrap;
}
.s9-btn:active{ transform:scale(.96); }
/* 弹层 */
.s9-mask{ position:fixed; inset:0; z-index:10100; background:rgba(0,0,0,.45); display:none;
  align-items:center; justify-content:center; }
.s9-mask.on{ display:flex; }
.s9-pop{ width:900px; max-height:1900px; background:#fff; border:4px solid #000; border-radius:18px;
  display:flex; flex-direction:column; padding:34px; box-sizing:border-box; }
.s9-pop-t{ font-size:44px; font-weight:700; color:#000; }
.s9-pop-h{ font-size:26px; color:#666; line-height:1.5; margin:14px 0 18px; }
.s9-pop-ta{ width:100%; min-height:520px; border:3px solid #000; border-radius:12px; padding:18px;
  font-size:28px; line-height:1.6; box-sizing:border-box; resize:none; outline:none; font-family:var(--sans); }
.s9-pop-err{ font-size:26px; color:#B20000; min-height:36px; margin-top:12px; }
.s9-pop-btns{ display:flex; gap:24px; justify-content:flex-end; margin-top:12px; }
.s9-pbtn{ min-width:170px; height:88px; border-radius:44px; border:3px solid var(--s-ink); display:flex;
  align-items:center; justify-content:center; font-size:34px; color:var(--s-ink); cursor:pointer; }
.s9-pbtn.pri{ background:#111; color:#fff; border-color:#111; }
/* S009 标题「表情包库」是 4 个字，比 .s-title 默认的 110px 宽 —— 右边缘对齐到 990px */
.s9-title{ left:660px; width:330px; }
/* 图片拉不回来（比如把网页地址当成图片填了）→ 标出来，别让用户对着一张破图猜 */
.s9-item img.bad{ background:#ffecec; }
.s9-item .bad-tip{ position:absolute; left:0; right:0; top:40%; text-align:center; font-size:24px; color:#c00; }
/* 每张表情右上角的删除键 —— 长按虽然也能删，但没人知道要长按，得有个看得见的入口 */
.s9-del{
  position:absolute; top:8px; right:8px; z-index:2;
  width:56px; height:56px; border-radius:50%; background:rgba(0,0,0,.5); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:30px; line-height:1;
  cursor:pointer;
}
.s9-del:active{ transform:scale(.9); }

/* ============================================================
   任务球（AI 生成进度）—— 见 app.js 的 MYF_TASK
   一个任务一个圆球：生成中转圈、完成打对钩，点一下回到对应界面。
   多个任务同时跑就竖着排一列，颜色区分。
   ============================================================ */
#taskballs{
  /* ⚠ bottom 别太小：Z001 底部依次是「头像行」(bottom 267~367) 和输入行，
     球压在那儿会挡住点头像。430 落在聊天区右下角，不遮操作区。 */
  position:absolute; right:34px; bottom:430px; z-index:10040;
  display:flex; flex-direction:column-reverse; gap:22px; align-items:center;
}
.tball{
  position:relative; width:112px; height:112px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:44px; line-height:1; color:#fff; cursor:pointer;
  box-shadow:0 10px 26px rgba(0,0,0,.28);
  transition:transform .16s, opacity .3s;
  user-select:none;
}
.tball:active{ transform:scale(.92); }
/* 转圈：用 border 拼一个缺口环 + 旋转 */
.tball .ring{
  position:absolute; inset:10px; border-radius:50%;
  border:7px solid rgba(255,255,255,.32); border-top-color:#fff;
  animation:tspin .9s linear infinite;
}
@keyframes tspin{ to{ transform:rotate(360deg); } }
.tball .ic{ position:relative; z-index:1; font-size:46px; }
/* 完成：对钩 + 淡出 */
.tball.done{ animation:tdone .3s ease; }
@keyframes tdone{ from{ transform:scale(.7); } to{ transform:scale(1); } }
.tball.fail .ic{ font-size:40px; }
/* 标签：贴在球的左边（球在右下角，左边才有地方放） */
.tball .lb{
  position:absolute; right:126px; top:50%; transform:translateY(-50%);
  white-space:nowrap; font-size:24px; padding:8px 16px; border-radius:12px;
  background:rgba(0,0,0,.62); color:#fff;
}

/* ============================================================
   S007 编辑库条目 —— 字段由 JS 按库类型生成（见 app.js 的 S7_SCHEMA）
   流式布局（不再绝对定位）：字段多少都能排下，滚动即可。
   ============================================================ */
.s7-title{ left:640px; width:350px; }
.s7-form{
  position:absolute; top:180px; left:60px; right:60px; bottom:200px;
  overflow-y:auto; padding-bottom:40px;
}
.s7-field{ margin-bottom:34px; }
.s7-field > label{ display:block; font-size:30px; color:var(--s-ink2); margin-bottom:12px; }
.s7-field .hint{ font-size:24px; color:var(--s-ink2); opacity:.8; margin-top:8px; line-height:1.5; }
.s7-in{
  width:100%; box-sizing:border-box; border:3px solid var(--s-ink); border-radius:14px;
  padding:18px 22px; font-size:32px; line-height:1.5; color:var(--s-ink);
  background:transparent; outline:none; font-family:var(--sans);
}
textarea.s7-in{ min-height:220px; resize:vertical; line-height:1.7; }
textarea.s7-in.tall{ min-height:520px; font-family:ui-monospace,Consolas,monospace; font-size:28px; }
/* 图片字段：预览 + 选图 */
.s7-imgwrap{ display:flex; gap:22px; align-items:flex-start; }
.s7-imgwrap .s7-in{ flex:1; }
.s7-imgprev{
  width:200px; height:200px; flex:0 0 auto; border:3px solid var(--s-ink); border-radius:14px;
  background:#f2f2f2 center/contain no-repeat; display:flex; align-items:center; justify-content:center;
  font-size:24px; color:var(--s-ink2); cursor:pointer;
}
/* 选项 chips */
.s7-chips{ display:flex; flex-wrap:wrap; gap:14px; }
.s7-chip{
  padding:14px 26px; border:3px solid var(--s-ink); border-radius:999px;
  font-size:28px; color:var(--s-ink); cursor:pointer; white-space:nowrap;
}
.s7-chip.on{ background:#111; color:#fff; }
/* 开关 */
.s7-tgl{
  width:110px; height:60px; border-radius:30px; border:3px solid var(--s-ink);
  position:relative; cursor:pointer; transition:background .18s;
}
.s7-tgl .knob{
  position:absolute; top:4px; left:4px; width:46px; height:46px; border-radius:50%;
  background:var(--s-ink); transition:left .18s;
}
.s7-tgl.on{ background:#111; }
.s7-tgl.on .knob{ left:54px; background:#fff; }
/* 步进器（插入位置） */
.s7-step{ display:flex; align-items:center; gap:20px; }
.s7-step-btn{
  width:84px; height:84px; border:3px solid var(--s-ink); border-radius:16px;
  display:flex; align-items:center; justify-content:center; font-size:44px; cursor:pointer;
}
.s7-step-val{
  min-width:130px; height:84px; border:3px solid var(--s-ink); border-radius:16px;
  display:flex; align-items:center; justify-content:center; font-size:36px; cursor:pointer;
}
/* 底部 */
.s7-foot{
  position:absolute; bottom:0; left:0; width:1080px; height:180px;
  display:flex; align-items:center; justify-content:center; gap:40px;
}
.s7-del{
  padding:0 40px; height:92px; border-radius:46px; border:3px solid #B20000; color:#B20000;
  display:flex; align-items:center; font-size:32px; cursor:pointer;
}
.s7-ok{
  padding:0 60px; height:92px; border-radius:46px; background:#111; color:#fff;
  display:flex; align-items:center; font-size:34px; cursor:pointer;
}
/* 宿主表单里的多行框（世界书条目内容 / 商品描述这类） */
.host-card-area{ min-height:120px; resize:vertical; line-height:1.6; font-family:inherit; }

/* ---- 世界书库：书里的条目列表（S007 的 book 字段） ---- */
.s7-book{ border:3px solid var(--s-ink); border-radius:14px; overflow:hidden; }
.s7-bookrow{ position:relative; padding:18px 70px 18px 22px; border-bottom:1px solid rgba(0,0,0,.12); cursor:pointer; }
.s7-bookrow:active{ background:rgba(0,0,0,.05); }
.s7-bookrow .bk-t{ font-size:32px; color:var(--s-ink); line-height:1.35; }
.s7-bookrow .bk-s{ font-size:24px; color:var(--s-ink2); margin-top:6px; line-height:1.4; }
.s7-bookrow .bk-del{
  position:absolute; right:16px; top:50%; transform:translateY(-50%);
  width:48px; height:48px; border-radius:50%; display:flex; align-items:center; justify-content:center;
  font-size:26px; color:#B20000; border:2px solid #B20000;
}
.s7-bookempty{ padding:40px 22px; text-align:center; font-size:28px; color:var(--s-ink2); }
.s7-bookadd{ padding:22px; text-align:center; font-size:30px; color:var(--s-ink); cursor:pointer; background:rgba(0,0,0,.04); }
/* ---- 绑定角色 ---- */
.s7-charpick{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  border:3px solid var(--s-ink); border-radius:14px; padding:16px 22px; cursor:pointer;
}
.s7-charpick .cp-name{ font-size:32px; color:var(--s-ink); }
.s7-charpick .cp-btn{ font-size:28px; color:var(--s-ink2); }

/* ---- S010 App 提示词（按 App 分组） ---- */
.s10-hint{ position:absolute; top:180px; left:60px; right:60px; font-size:24px; color:var(--s-ink2); line-height:1.5; }
.s10-body{ position:absolute; top:250px; left:0; width:1080px; bottom:0; overflow-y:auto; padding:0 60px 80px; box-sizing:border-box; }
.s10-group{ font-size:30px; font-weight:700; color:var(--s-ink); margin:34px 0 12px; }
.s10-row{ border:3px solid var(--s-ink); border-radius:14px; padding:18px 22px; margin-bottom:16px; }
.s10-row.on{ background:rgba(0,0,0,.05); }
.s10-top{ display:flex; align-items:center; gap:16px; }
.s10-name{ flex:1; font-size:30px; color:var(--s-ink); line-height:1.35; word-break:break-word; }
.s10-tag{ font-size:22px; color:var(--s-ink2); border:2px solid var(--s-ink2); border-radius:8px; padding:2px 10px; }
.s10-btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:14px; }
.s10-b{ padding:10px 20px; border:3px solid var(--s-ink); border-radius:999px; font-size:24px; color:var(--s-ink); cursor:pointer; }
.s10-b.pri{ background:#111; color:#fff; }
.s10-b.del{ border-color:#B20000; color:#B20000; }

/* ============================================================
   公网密码门（gate.js）—— 只有部署到非本机地址、且配了密码时才出现
   ============================================================ */
#myf-gate{
  position:fixed; inset:0; z-index:99999; background:#14161a;
  display:flex; align-items:center; justify-content:center; padding:32px; box-sizing:border-box;
}
#myf-gate .g-card{
  width:100%; max-width:420px; background:#1e2127; border-radius:20px; padding:34px 28px 28px;
  box-shadow:0 20px 60px rgba(0,0,0,.5); text-align:center;
}
#myf-gate .g-title{ font-size:24px; font-weight:700; color:#fff; }
#myf-gate .g-sub{ font-size:13px; color:#8b93a1; margin:8px 0 22px; }
#myf-gate .g-in{
  width:100%; box-sizing:border-box; height:52px; border-radius:12px; border:1.5px solid #3a404a;
  background:#14161a; color:#fff; font-size:16px; padding:0 16px; outline:none;
}
#myf-gate .g-in:focus{ border-color:#5B8DEF; }
#myf-gate .g-err{ min-height:20px; font-size:13px; color:#e05c5c; margin:10px 0 4px; }
#myf-gate .g-btn{
  height:52px; border-radius:12px; background:#5B8DEF; color:#fff; font-size:17px; font-weight:600;
  display:flex; align-items:center; justify-content:center; cursor:pointer; margin-top:6px;
}
#myf-gate .g-btn:active{ transform:scale(.98); }
