/* ===== 云枢智控 · 我的屏样式（mobile.profile.css，20260865） =====
   👤 我的：账号卡/通知开关/权限入口/关于版本。复用 us-switch 开关样式。
   仅被 /static/mobile.html 引用。约束：单文件 ≤200 行。
   ⛔ 运营官确认锁死机制(08-18): 【v20260934p 锁死版】后续 3 级页勿改本页, 另立文件按本页导航结构开发。 */

.profile-body{padding:0 14px 12px;display:flex;flex-direction:column;gap:12px}
/* ⑪ 个人中心卡片间距：.asd-profile 自带 vertical margin:24px 与容器 gap:12px 叠加 → 卡间距≈60px 过大;
   此处只去垂直 margin 只留容器 gap(12px) 统一紧凑，水平内边距保留。 */
.profile-body .asd-profile{margin:0 16px}
/* 老板08-29: 个人中心去底部小蓝钮, 改左上简单返回键 —— 固定贴顶(不随内容滚动), z61 盖过账号卡/内容; 白帽衬出accent箭头 */
#screen-profile .back-btn{position:fixed;top:env(safe-area-inset-top,0px);left:6px;z-index:61;height:44px;color:var(--accent)}
#screen-profile{position:relative}
.pf-card{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:14px;box-shadow:var(--card-shadow)}
/* v20260934l 老板08-18 微信个人中心式: 去导航栏后账号区=占屏1.5/6~1.8/6大帽子(实测844pt*0.27≈228pt),
   主区=头像居中偏左大图+昵称/ID, 右侧箭头+二维码; 脚部居下=状态+主题单按钮(AppTheme.toggleTheme循环);
   无框通透白块, 顶部贴屏顶(去导航栏); 头像带白描边+轻投影 */
.pf-account{
  display:flex;flex-direction:column;
  margin:0 -14px;padding:calc(env(safe-area-inset-top, 0px) + 48px) 20px 14px;   /* 老板08-29: 顶部留白加大(容纳左上返回键), 账号区更松弛不复贴刘海 */
  min-height:calc(100vh / 6 * 1.9);   /* 老板08-29: 头像/昵称栏加高(1.6→1.9/6, 更显从容; 原1.5/6~1.8/6区间上移) */
  background:var(--card);border:none;box-shadow:none;border-radius:0;box-sizing:border-box;
}
/* v20260934p 老板纠正: 头像+文字组靠左留白(非左右居中, 左侧留白), 上下居中;
   文字栏三行=昵称/状态(绿点在线)/ID, 头像60px与三行一条线平齐(大小相称), 长昵称ellipsis不破版;
   右侧二维码/箭头绝对定位贴右; padding-bottom:27px 补偿脚部主题按钮占用——内容中心对准帽子几何中心(dy≈0, 参考iPhone13 844pt, box-sizing:border-box) */
.pf-acc-main{flex:1;display:flex;align-items:center;justify-content:flex-start;gap:16px;position:relative;min-height:0;padding-bottom:27px}
/* 老板08-19: 头像改方形显示(圆角方形12px, 参照微信个人中心), 不再圆形 */
.pf-avatar{width:60px;height:60px;border-radius:12px;object-fit:cover;flex-shrink:0;border:3px solid var(--card);box-shadow:0 4px 14px rgba(0,0,0,.14)}
.pf-acc-info{flex:0 1 auto;min-width:0;text-align:left}
.pf-name{font-size:22px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:200px}
.pf-status{display:flex;align-items:center;gap:5px;font-size:12px;color:var(--sub);margin-top:5px}
.pf-dot{width:8px;height:8px;border-radius:50%;background:var(--online);flex-shrink:0}
.pf-id{font-size:12px;color:var(--sub);margin-top:2px}
/* v20260934n 脚部=仅主题小圆标(纯图标), 靠右下, 贴近帽底不悬空 */
.pf-acc-foot{display:flex;align-items:center;justify-content:flex-end;margin-top:0}
.pf-acc-side{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;flex-shrink:0}
.pf-qr-btn{
  width:34px;height:34px;display:flex;align-items:center;justify-content:center;
  background:var(--bg);border:1px solid var(--border);border-radius:8px;
  color:var(--sub);cursor:pointer;padding:0;
}
.pf-qr-btn:active{opacity:.7}
.pf-qr-btn svg{width:22px;height:22px;display:block}
.pf-account .mc-arrow{font-size:24px;color:var(--sub);flex-shrink:0;line-height:1}
/* v20260934n 主题单按钮: 纯图标小圆标(无文字, 老板: 用过一次不会天天设置, 做成标识即可), 右下脚部, toggleTheme 循环 */
.pf-theme-btn{
  display:flex;align-items:center;justify-content:center;
  width:34px;height:34px;padding:0;
  background:var(--bg);border:1px solid var(--border);border-radius:50%;
  color:var(--sub);cursor:pointer;
}
.pf-theme-btn:active{opacity:.75}
.pf-theme-btn .pt-ico{width:18px;height:18px}
.pf-theme-btn .pt-ico svg{width:18px;height:18px;display:block}
/* v20260934m 老板: 退出登录放入「设置」卡片行内(不再独立底部整行) */
.pf-logout-row{color:var(--offline);font-weight:600}
/* 保留旧 .pf-logout 兼容(不再渲染) */
.pf-logout{
  min-height:44px;width:100%;border-radius:12px;
  background:var(--card);color:var(--offline);border:1px solid var(--border);
  font-size:15px;font-weight:600;cursor:pointer;
}
.pf-logout:active{opacity:.85}
.pf-sec-title{font-size:12px;color:var(--sub);font-weight:700;margin-bottom:8px}
.pf-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  min-height:48px;width:100%;background:none;border:none;color:var(--text);
  font-size:16px;cursor:pointer;text-align:left;
}
.pf-row + .pf-row{border-top:1px solid var(--border)}
.pf-row-lbl{flex:1;min-width:0}
.pf-link:active{opacity:.7}
.pf-ver{font-size:14px;color:var(--accent);font-weight:700}
.pf-update{margin-top:8px;padding:10px;background:var(--bg);border-radius:10px;font-size:12px;color:var(--text);line-height:1.7}
.pf-update ul{margin:6px 0 0 18px}
.pf-update li{margin:2px 0}
/* v20260934j 老板反馈: 主题外观 3 选择卡片改一行(图标+文字横排), 高度紧凑不占版面 */
.pf-theme-pick{display:flex;gap:8px}
.pf-theme-card{
  flex:1;min-width:0;display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;
  padding:8px 4px;background:var(--bg);border:1.5px solid var(--border);border-radius:10px;
  color:var(--text);font-size:13px;font-weight:600;cursor:pointer;min-height:40px;
}
.pf-theme-card:active{opacity:.8}
.pf-theme-card.active{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
/* v20260934j 总纲「矢量细线单色图标」：.pt-ico 内为 SVG，居中定宽高，currentColor 随选中态 */
.pt-ico{display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center;color:currentColor}
.pt-ico svg{width:22px;height:22px;display:block}
/* v20260934q 昵称/二维码 弹窗（运营官 P0：改昵称 PUT /api/profile + 个人主页 URL 码 canvas 生成）。
   居中卡片，遮罩点空白关闭；触控热区 ≥44pt 由 min-height 保证 */
.pf-modal-overlay{position:fixed;inset:0;z-index:400;background:#000c;display:none;align-items:center;justify-content:center;padding:20px}
.pf-modal-overlay.show{display:flex}
.pf-modal{width:100%;max-width:320px;background:var(--card);border:1px solid var(--border);border-radius:14px;padding:18px;box-shadow:var(--card-shadow)}
.pf-modal-title{font-size:17px;font-weight:700;color:var(--text);margin-bottom:12px;text-align:center}
.pf-modal-input{width:100%;box-sizing:border-box;min-height:44px;border:1px solid var(--border);border-radius:10px;background:var(--bg);color:var(--text);font-size:16px;padding:0 12px}
.pf-modal-err{color:var(--offline);font-size:12px;min-height:16px;margin-top:6px}
.pf-modal-actions{display:flex;gap:10px;margin-top:12px}
.pf-modal-btn{flex:1;min-height:44px;border:none;border-radius:10px;font-size:16px;font-weight:600;cursor:pointer}
.pf-modal-cancel{background:var(--bg);color:var(--text)}
.pf-modal-ok{background:var(--accent);color:#fff}
.pf-modal-ok:active,.pf-modal-cancel:active{opacity:.8}
.pf-qr-wrap{display:flex;justify-content:center;padding:4px 0 8px}
.pf-qr-wrap canvas{border-radius:8px;box-shadow:0 2px 10px rgba(0,0,0,.12);max-width:100%}
.pf-qr-tip{font-size:13px;color:var(--sub);text-align:center;margin-top:4px}
.pf-qr-url{font-size:11px;color:var(--sub);text-align:center;margin-top:8px;word-break:break-all;line-height:1.5}