/* ============================================================
   app.css - 亲心引擎 Web 镜像 · 品牌样式（绿金系）
   组件渲染样式（fr-*）与 form-renderer 预览台同源，保证预览一致
   ============================================================ */
* { margin: 0; padding: 0; box-sizing: border-box; }
html, body { height: 100%; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", sans-serif;
  background: #f4f1ea;
  color: #3a3a3a;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

/* ============ 站点头部 ============ */
.site-header {
  background: linear-gradient(135deg, #2d5a3a 0%, #3f7a4e 100%);
  color: #fff;
  padding: 14px 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px 20px;
  box-shadow: 0 2px 10px rgba(40,60,40,.25);
}
.site-brand { display: flex; align-items: center; gap: 10px; }
.site-logo {
  width: 38px; height: 38px; border-radius: 10px;
  background: linear-gradient(135deg, #c9a227, #e6c55c);
  color: #3a2d00; font-size: 20px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: inset 0 -2px 4px rgba(0,0,0,.15);
}
.site-title { font-size: 17px; font-weight: 600; letter-spacing: 1px; }
.site-sub { font-size: 12px; opacity: .8; margin-top: 2px; }
.site-nav { display: flex; gap: 6px; }
.nav-link {
  color: #eaf2ea; text-decoration: none; font-size: 14px;
  padding: 7px 16px; border-radius: 8px; transition: background .15s;
}
.nav-link:hover { background: rgba(255,255,255,.15); }
.nav-link.active { background: rgba(255,255,255,.22); font-weight: 600; }
.site-status { font-size: 12px; padding: 5px 12px; border-radius: 12px; background: rgba(0,0,0,.2); }

/* ============ 主区 ============ */
.app-main { flex: 1; width: 100%; max-width: 1100px; margin: 0 auto; padding: 20px 24px 96px; }

/* ============ 首页 ============ */
.home-loading { text-align: center; color: #8a8a7a; padding: 80px 0; font-size: 14px; }
.home-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; flex-wrap: wrap; gap: 8px; }
.home-head h2 { font-size: 18px; color: #2d3a2d; }
.eng-badge { font-size: 12px; padding: 4px 12px; border-radius: 12px; }
.eng-badge.online { background: #e2efe2; color: #2d7a3a; }
.eng-badge.fallback { background: #f5e9d6; color: #a36a00; }
.home-cards {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 16px;
}
.home-card {
  background: #fff; border: 1px solid #e2dccf; border-radius: 12px;
  padding: 22px 18px; text-align: center; cursor: pointer;
  transition: all .18s; box-shadow: 0 2px 6px rgba(60,50,30,.06);
}
.home-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(60,50,30,.12);
  border-color: #b8c9a8;
}
.home-card-icon { width: 52px; height: 52px; object-fit: contain; margin-bottom: 10px; }
.home-card-name { font-size: 16px; font-weight: 600; color: #2d3a2d; }
.home-card-code { font-size: 12px; color: #a39a80; margin-top: 4px; }

/* ============ 模型页 ============ */
.model-bar {
  display: flex; align-items: center; gap: 12px; margin-bottom: 14px;
  padding: 8px 2px;
}
.model-back { color: #2d5a3a; text-decoration: none; font-size: 14px; font-weight: 600; }
.model-back:hover { text-decoration: underline; }
.model-code {
  font-size: 13px; color: #6a6a5a; background: #e8e2d5; border-radius: 10px; padding: 3px 12px;
}
.env-container { background: #fff; border: 1px solid #e2dccf; border-radius: 12px; overflow: hidden; }

/* ============ 封套（env-*） ============ */
.env-loading, .env-error { text-align: center; color: #8a8a7a; padding: 60px 0; font-size: 14px; }
.env-error { color: #d9534f; }
.env-wrap { min-height: 420px; display: flex; flex-direction: column; }
.env-header {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 18px; border-bottom: 1px solid #eee9dd;
  background: #faf8f2; flex-wrap: wrap;
}
.env-model-name { font-size: 17px; font-weight: 600; color: #2d3a2d; flex: 1; }
.env-selector { position: relative; }
.env-selector-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 14px; border: 1px solid #cfc8b8; border-radius: 8px;
  background: #fff; font-size: 13px; cursor: pointer; color: #3a3a3a;
}
.env-selector-btn:hover { border-color: #2d5a3a; }
.env-dropdown {
  position: absolute; top: calc(100% + 4px); left: 0; z-index: 30;
  background: #fff; border: 1px solid #d8d2c2; border-radius: 8px;
  box-shadow: 0 6px 18px rgba(60,50,30,.14); min-width: 200px; max-height: 260px; overflow: auto;
}
.env-dropdown-item { padding: 10px 14px; font-size: 13px; cursor: pointer; }
.env-dropdown-item:hover { background: #f0ede4; color: #2d5a3a; }
.env-refresh-btn {
  border: 1px solid #cfc8b8; background: #fff; color: #5a6a5a;
  width: 30px; height: 30px; border-radius: 8px; cursor: pointer; font-size: 15px;
}
.env-refresh-btn:hover { border-color: #2d5a3a; color: #2d5a3a; }

.env-tabs { display: flex; border-bottom: 2px solid #e8e2d5; background: #faf8f2; }
.env-tab {
  padding: 11px 22px; font-size: 14px; color: #6a6a5a; cursor: pointer;
  border-bottom: 3px solid transparent; margin-bottom: -2px; transition: all .15s;
}
.env-tab:hover { color: #2d5a3a; }
.env-tab.active { color: #2d5a3a; font-weight: 600; border-bottom-color: #2d5a3a; }

.env-body { padding: 18px; flex: 1; }
.env-topcard {
  border: 1px solid #e4ded0; border-radius: 10px; padding: 14px 16px; margin-bottom: 14px;
  background: linear-gradient(180deg, #fdfcf8, #f7f4ea);
}
.env-topcard-head { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.env-topcard-icon { width: 34px; height: 34px; object-fit: contain; }
.env-topcard-title { font-size: 15px; font-weight: 600; color: #2d3a2d; }
.env-topcard-desc { font-size: 12px; color: #8a8a7a; margin-top: 2px; }

.env-entries { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
.env-entry-btn {
  display: flex; align-items: center; gap: 8px;
  padding: 10px 18px; border: 1px solid #cfc8b8; border-radius: 10px;
  background: #fff; font-size: 14px; cursor: pointer; color: #3a3a3a;
  transition: all .15s;
}
.env-entry-btn:hover { border-color: #2d5a3a; color: #2d5a3a; box-shadow: 0 3px 10px rgba(60,50,30,.1); }
.env-entry-icon { width: 22px; height: 22px; object-fit: contain; }

.env-slot {
  margin-top: 14px; padding: 16px; border: 1px dashed #d8d2c2; border-radius: 10px;
  text-align: center; color: #a39a80; font-size: 13px;
}
.env-slot-ai { border-color: #b8c9a8; background: #f4f8f2; }
.env-slot-gb { border-color: #e0d4b8; background: #faf7ee; }

.env-bottom {
  display: flex; border-top: 1px solid #eee9dd; background: #faf8f2;
  padding: 8px 12px; gap: 6px;
}
.env-bottom-item {
  flex: 1; text-align: center; padding: 8px 4px; border-radius: 8px;
  font-size: 13px; color: #5a6a5a; cursor: pointer; transition: background .15s;
}
.env-bottom-item:hover { background: #f0ede4; color: #2d5a3a; }
.env-bottom-icon { width: 22px; height: 22px; display: block; margin: 0 auto 4px; object-fit: contain; }

/* ============ 弹窗（popup-*） ============ */
.popup-overlay {
  position: fixed; inset: 0; background: rgba(30,40,30,.55);
  display: flex; align-items: flex-start; justify-content: center;
  z-index: 1000; padding: 6vh 16px 16px; overflow-y: auto;
}
.popup-panel {
  background: #fff; border-radius: 14px; width: 100%; max-width: 640px;
  box-shadow: 0 20px 50px rgba(0,0,0,.25); overflow: hidden;
  animation: popup-in .2s ease-out;
}
@keyframes popup-in { from { opacity: 0; transform: translateY(-14px); } to { opacity: 1; transform: translateY(0); } }
.popup-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; background: #faf8f2; border-bottom: 1px solid #eee9dd;
}
.popup-title { font-size: 16px; font-weight: 600; color: #2d3a2d; }
.popup-close {
  border: none; background: #e8e2d5; width: 28px; height: 28px; border-radius: 50%;
  cursor: pointer; font-size: 14px; color: #5a6a5a;
}
.popup-close:hover { background: #d9534f; color: #fff; }
.popup-body { padding: 16px 18px; }
.popup-bar { display: flex; justify-content: flex-end; gap: 10px; margin-top: 14px; padding-top: 12px; border-top: 1px solid #eee9dd; }
.popup-menu-item {
  padding: 11px 14px; border: 1px solid #eee9dd; border-radius: 8px; margin-bottom: 8px;
  font-size: 14px; cursor: pointer; transition: all .15s;
}
.popup-menu-item:hover { border-color: #2d5a3a; color: #2d5a3a; }

/* ============ 组件画廊 ============ */
.gallery-frame { width: 100%; height: calc(100vh - 220px); min-height: 480px; border: 1px solid #e2dccf; border-radius: 10px; background: #fff; }

/* ============ 页脚 ============ */
.site-footer {
  text-align: center; color: #a8a290; font-size: 12px;
  padding: 16px 16px 64px; border-top: 1px solid #e8e2d5; background: #faf8f2;
}

/* ============================================================
   form-renderer 渲染样式（fr-*）——与预览台同源
   ============================================================ */
.fr-loading { text-align: center; color: #8a8a7a; padding: 50px 0; font-size: 14px; }
.fr-error { text-align: center; color: #d9534f; padding: 36px 0; }
.fr-retry-btn {
  margin-top: 12px; padding: 6px 20px; border: 1px solid #d9534f; color: #d9534f;
  background: #fff; border-radius: 6px; cursor: pointer; font-size: 13px;
}
.fr-empty { text-align: center; color: #b0a890; padding: 42px 0; font-size: 14px; }
.fr-empty-icon { display: block; font-size: 38px; margin-bottom: 10px; color: #d8d2c2; }
.fr-muted { color: #a39a80; }

.fr-table-wrap { overflow-x: auto; }
.fr-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.fr-table th {
  background: #f0ede4; padding: 9px 10px; text-align: left;
  font-weight: 600; color: #4a5a4a; border-bottom: 2px solid #d8d2c2; white-space: nowrap;
}
.fr-table td { padding: 9px 10px; border-bottom: 1px solid #eee9dd; vertical-align: middle; }
.fr-table tr:hover td { background: #faf8f2; }
.fr-table tr.fr-row-selected td { background: #f0f5ee; }
.fr-col-idx { color: #b0a890; width: 42px; }
.fr-col-ops { white-space: nowrap; width: 90px; }
.fr-sortable { cursor: pointer; user-select: none; }
.fr-sortable:hover { color: #2d5a3a; }
.fr-req { color: #d9534f; margin-left: 2px; }
.fr-link { color: #2d7a3a; cursor: pointer; font-size: 12px; margin-right: 8px; }
.fr-link-danger { color: #d9534f; }
.fr-tag { display: inline-block; background: #eef3ec; color: #2d5a3a; font-size: 12px; padding: 2px 8px; border-radius: 8px; margin: 1px 2px; }
.fr-tag-green { background: #dcecdc; }
.fr-thumb { width: 44px; height: 44px; object-fit: cover; border-radius: 6px; border: 1px solid #e0dac8; cursor: zoom-in; }
.fr-thumb-lg { width: 84px; height: 84px; }
.fr-status { display: inline-block; padding: 2px 10px; border-radius: 10px; font-size: 12px; color: #fff; }

.fr-pagination { display: flex; align-items: center; justify-content: center; gap: 6px; padding: 14px 0 4px; }
.fr-page-btn {
  min-width: 28px; height: 28px; padding: 0 6px; border-radius: 6px;
  border: 1px solid #d8d2c2; background: #fff; font-size: 13px; cursor: pointer;
}
.fr-page-btn.active { background: #2d5a3a; color: #fff; border-color: #2d5a3a; }
.fr-page-btn:disabled { opacity: .4; cursor: default; }

.fr-add-row { margin-top: 10px; }

.fr-form { max-width: 620px; }
.fr-field { margin-bottom: 14px; }
.fr-field-label { font-size: 13px; font-weight: 600; color: #4a5a4a; margin-bottom: 6px; }
.fr-input {
  width: 100%; padding: 8px 10px; border: 1px solid #d8d2c2; border-radius: 6px;
  font-size: 14px; background: #fff; outline: none; font-family: inherit;
}
.fr-input:focus { border-color: #2d5a3a; }
.fr-textarea { min-height: 84px; resize: vertical; }
.fr-datetime-row { display: flex; gap: 8px; }
.fr-select-wrap { position: relative; }
.fr-select {
  width: 100%; padding: 8px 10px; border: 1px solid #d8d2c2; border-radius: 6px;
  font-size: 14px; background: #fff; appearance: none; cursor: pointer; font-family: inherit;
}
.fr-select-arrow { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 12px; color: #8a8a7a; pointer-events: none; }
.fr-switch-row { display: flex; align-items: center; justify-content: space-between; }
.fr-switch { position: relative; width: 46px; height: 26px; display: inline-block; }
.fr-switch input { opacity: 0; width: 0; height: 0; }
.fr-switch .slider {
  position: absolute; inset: 0; background: #d8d2c2; border-radius: 26px; transition: .2s; cursor: pointer;
}
.fr-switch .slider:before {
  content: ""; position: absolute; width: 20px; height: 20px; left: 3px; top: 3px;
  background: #fff; border-radius: 50%; transition: .2s; box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.fr-switch input:checked + .slider { background: #2d7a3a; }
.fr-switch input:checked + .slider:before { transform: translateX(20px); }
.fr-form-actions { display: flex; gap: 12px; margin-top: 18px; }
.fr-btn-primary {
  padding: 9px 26px; background: #2d5a3a; color: #fff; border: none;
  border-radius: 6px; font-size: 14px; cursor: pointer; transition: background .15s;
}
.fr-btn-primary:hover { background: #3f7a4e; }
.fr-btn-ghost {
  padding: 9px 26px; background: #fff; color: #5a6a5a; border: 1px solid #cfc8b8;
  border-radius: 6px; font-size: 14px; cursor: pointer; transition: all .15s;
}
.fr-btn-ghost:hover { border-color: #2d5a3a; color: #2d5a3a; }
.fr-btn-sm { padding: 6px 14px; font-size: 13px; }
.fr-error-tip { color: #d9534f; font-size: 12px; margin-top: 4px; }

.fr-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 14px; }
.fr-card {
  border: 1px solid #e4ded0; border-radius: 10px; padding: 14px 16px;
  background: #fff; cursor: pointer; transition: all .15s;
}
.fr-card:hover { box-shadow: 0 4px 12px rgba(60,50,30,.1); transform: translateY(-2px); }
.fr-card-title { font-size: 15px; font-weight: 600; color: #2d3a2d; margin-bottom: 8px; }
.fr-card-row { font-size: 13px; color: #6a6a5a; margin-bottom: 4px; display: flex; }
.fr-card-k { color: #9a9278; min-width: 68px; flex-shrink: 0; }
.fr-card-v { word-break: break-all; }
.fr-card-img { width: 100%; height: 120px; object-fit: cover; border-radius: 6px; margin-bottom: 8px; cursor: zoom-in; }

.fr-inline { font-size: 13px; }
.fr-inline-row { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #eee9dd; }
.fr-inline-row:hover { background: #faf8f2; }
.fr-inline-idx { color: #b0a890; width: 28px; flex-shrink: 0; text-align: right; }
.fr-inline-cell { flex: 1; min-width: 0; }
.fr-inline-input {
  width: 100%; padding: 6px 8px; border: 1px solid #2d7a3a; border-radius: 4px;
  font-size: 13px; outline: none; font-family: inherit;
}
.fr-inline-actions { display: flex; gap: 8px; flex-shrink: 0; }

/* ============ 响应式 ============ */
@media (max-width: 720px) {
  .site-header { padding: 12px 16px; }
  .site-nav { order: 3; width: 100%; justify-content: space-between; }
  .nav-link { flex: 1; text-align: center; padding: 8px 4px; }
  .app-main { padding: 14px 12px 30px; }
  .home-cards { grid-template-columns: repeat(2, 1fr); gap: 10px; }
  .env-body { padding: 12px; }
  .env-tab { padding: 10px 14px; font-size: 13px; }
  .fr-cards { grid-template-columns: 1fr; }
  .fr-inline-row { flex-wrap: wrap; }
}

/* ============================================================
   手机视口模式（device-phone）——镜像调试台默认视图
   ============================================================ */
.site-actions { display: flex; align-items: center; gap: 10px; }
.device-btn {
  border: 1px solid rgba(255,255,255,.4); background: rgba(255,255,255,.12);
  color: #fff; padding: 5px 12px; border-radius: 12px; cursor: pointer; font-size: 12px;
}
.device-btn:hover { background: rgba(255,255,255,.25); }

body.device-phone .app-main {
  width: 100%; max-width: 420px;
  margin: 18px auto 40px; padding: 0;
  background: #fff; border: 8px solid #1c1c1c; border-radius: 30px;
  box-shadow: 0 24px 60px rgba(30,40,30,.35);
  overflow: hidden; min-height: calc(100vh - 120px);
}
body.device-phone .app-main > * { padding-left: 14px; padding-right: 14px; }
body.device-phone .home-loading { padding: 60px 0; }
body.device-phone .model-bar { padding: 12px 4px; }
body.device-phone .env-container { border-radius: 0; border-left: none; border-right: none; }
body.device-phone .site-footer { padding-bottom: 72px; }
body.device-phone .tab-bar { border-radius: 14px 14px 0 0; }

/* ============ 试测台（tb-*） ============ */
.tb-head { display: flex; align-items: baseline; gap: 12px; margin: 10px 0 16px; flex-wrap: wrap; }
.tb-head h2 { font-size: 18px; color: #2d3a2d; }
.tb-sub { font-size: 12px; color: #a39a80; }
.tb-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
@media (max-width: 720px) { .tb-grid { grid-template-columns: 1fr 1fr; } }
.tb-card {
  border: 1px solid #e4ded0; border-radius: 10px; padding: 12px;
  cursor: pointer; transition: all .15s; background: #fff;
}
.tb-card:hover { border-color: #2d5a3a; box-shadow: 0 4px 12px rgba(60,50,30,.1); }
.tb-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.tb-no { font-size: 11px; font-weight: 700; color: #8a7a4a; background: #f5f0e0; padding: 2px 8px; border-radius: 8px; }
.tb-status { font-size: 11px; }
.tb-ready .tb-status { color: #2d7a3a; }
.tb-todo .tb-status { color: #b07a1a; }
.tb-name { font-size: 14px; font-weight: 600; color: #2d3a2d; margin-bottom: 4px; }
.tb-note { font-size: 11px; color: #8a8a7a; margin-bottom: 8px; line-height: 1.5; }
.tb-meta { font-size: 11px; color: #a39a80; }
.tb-tip { margin-top: 14px; font-size: 11px; color: #a39a80; background: #faf8f2; border: 1px dashed #d8d2c2; border-radius: 8px; padding: 10px 12px; line-height: 1.6; }

.tb-bar { display: flex; align-items: center; gap: 10px; margin: 8px 0 12px; }
.tb-panel { border: 1px solid #e4ded0; border-radius: 10px; padding: 12px; background: #fff; }
.tb-controls { display: flex; flex-wrap: wrap; gap: 8px; align-items: flex-end; margin-bottom: 12px; }
.tb-ctl { font-size: 11px; color: #6a6a5a; display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 110px; }
.tb-ctl .fr-select { font-size: 12px; padding: 6px 8px; }
.tb-render { border-top: 1px solid #eee9dd; padding-top: 10px; }

.tb-todo { text-align: center; padding: 30px 16px; }
.tb-todo-icon { font-size: 40px; margin-bottom: 10px; }
.tb-todo-title { font-size: 16px; font-weight: 600; color: #2d3a2d; margin-bottom: 8px; }
.tb-todo-note { font-size: 13px; color: #6a6a5a; margin-bottom: 14px; }
.tb-todo-meta { font-size: 12px; color: #8a8a7a; margin-bottom: 6px; }
.tb-todo-next { margin-top: 16px; font-size: 12px; color: #2d7a3a; background: #f0f5ee; border-radius: 8px; padding: 10px 12px; }

/* ============================================================
   小程序壳镜像（shell-nav / tab-bar / home 6 分区 / tab 页）
   与 4.0 pages 各页 wxss 同源（rpx→px，÷2）
   ============================================================ */
/* ---- 壳导航栏（镜像 navigationBar #1a5fb4） ---- */
.shell-nav {
  background: #1a5fb4; color: #fff;
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; gap: 8px;
  box-shadow: 0 2px 8px rgba(26,95,180,.25);
  position: sticky; top: 0; z-index: 200;
}
.nav-back { color:#fff; text-decoration:none; font-size:24px; line-height:1; padding:0 8px 3px; border-radius:6px; display:flex; align-items:center; }
.nav-back:hover { background: rgba(255,255,255,.18); }
.nav-title { font-size:17px; font-weight:600; letter-spacing:1px; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.nav-dev { display:flex; align-items:center; gap:6px; }
.dev-link { color:#dbe6f5; text-decoration:none; font-size:12px; padding:4px 8px; border-radius:6px; border:1px solid rgba(255,255,255,.25); }
.dev-link:hover { background: rgba(255,255,255,.15); }

/* ---- 底部 TabBar（镜像 app.json tabBar：#F6F3E9 / 选中 #8b6914）----
   悬浮固定：fixed 钉在视口底部，不随内容滚动 */
.tab-bar {
  display: flex; background: #F6F3E9; border-top: 1px solid #e0dac8;
  position: fixed; bottom: 0; left: 0; right: 0;
  z-index: 300;
  box-shadow: 0 -2px 10px rgba(60,50,30,.08);
}
.tab-item {
  flex: 1; text-align: center; padding: 11px 0 13px;
  text-decoration: none; color: #999; font-size: 13px;
  display: flex; flex-direction: column; align-items: center; gap: 2px;
  letter-spacing: 2px;
}
.tab-item.active { color: #8b6914; font-weight: 600; }

/* ---- 通用：加载/空态/卡片 ---- */
.state-box { text-align: center; padding: 40px 16px; color: #8a8a7a; font-size: 13px; }
.state-ico { width: 34px; height: 34px; margin: 0 auto 10px; border-radius: 50%; border: 2px solid #d8d2c2; border-top-color: #c9a227; animation: sp .9s linear infinite; }
@keyframes sp { to { transform: rotate(360deg); } }
.home-error { text-align: center; color: #b8860b; font-size: 12px; margin: 8px 0; }
.card { background: #fff; border-radius: 10px; padding: 12px 14px; box-shadow: 0 2px 8px rgba(0,0,0,.04); }
.section-title { font-size: 15px; font-weight: 600; color: #333; margin: 12px 0 8px; }

/* ---- ① 轮播 ---- */
.banner { position: relative; width: 100%; height: 180px; border-radius: 10px; overflow: hidden; margin-bottom: 10px; }
.banner-track { display: flex; height: 100%; transition: transform .5s ease; }
.banner-item { flex: 0 0 100%; height: 100%; }
.banner-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.banner-placeholder { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg,#2c1810,#4a2a1a); color: rgba(255,255,255,.6); font-size: 14px; }
.banner-dots { position:absolute; bottom:8px; left:0; right:0; display:flex; justify-content:center; gap:6px; }
.banner-dot { width:6px; height:6px; border-radius:50%; background: rgba(255,255,255,.5); transition: all .2s; }
.banner-dot.active { background:#fff; width:14px; border-radius:3px; }

/* ---- ② 跑马灯 ---- */
.marquee { background:#fff8ef; margin: 8px 0; padding: 6px 10px; border-radius: 6px; overflow:hidden; white-space:nowrap; }
.marquee-text { font-size: 12px; color: #b8860b; }

/* ---- ③ 常用/收藏 ---- */
.freq-card { margin-bottom: 10px; }
.freq-bar { display:flex; border-bottom:1px solid #eee; margin-bottom:8px; position:relative; }
.freq-tab { flex:1; text-align:center; padding:6px 0; font-size:14px; color:#666; position:relative; cursor:pointer; }
.freq-tab.active { color:#2d5a3a; font-weight:600; }
.freq-tab.active::after { content:''; position:absolute; bottom:-1px; left:50%; transform:translateX(-50%); width:60%; height:2px; background:#2d5a3a; border-radius:1px; }
.freq-grid { display:flex; flex-wrap:wrap; gap:6px; }
.freq-item { width: calc(20% - 5px); text-align:center; padding:5px 0; cursor:pointer; }
.freq-icon { width:36px; height:36px; border-radius:18px; background:#f0e6d3; display:flex; align-items:center; justify-content:center; margin:0 auto 3px; overflow:hidden; }
.freq-icon-img { width:100%; height:100%; object-fit:cover; }
.freq-icon-text { font-size:14px; color:#8b6914; }
.freq-name { font-size:11px; color:#555; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.freq-empty { width:100%; text-align:center; padding:10px 0; font-size:12px; color:#999; }

/* ---- ④ 模型菜单（手风琴） ---- */
.menu-list { display:flex; flex-direction:column; gap:6px; }
.menu-row { border-radius:10px; overflow:hidden; box-shadow:0 1px 4px rgba(0,0,0,.04); background:#fff; }
.menu-row-head { display:flex; align-items:center; gap:8px; padding:14px 12px; background:#fff; cursor:pointer; }
.menu-row-icon-img { width:28px; height:28px; border-radius:6px; flex-shrink:0; object-fit:cover; }
.menu-row-name { flex:1; font-size:16px; font-weight:600; color:#333; letter-spacing:2px; }
.menu-row-name.active { color:#2d5a3a; }
.menu-row-arrow { width:8px; height:8px; border-right:2px solid #999; border-bottom:2px solid #999; transform:rotate(45deg); margin-right:6px; transition:transform .2s; flex-shrink:0; }
.menu-row-arrow.open { transform:rotate(-135deg); border-color:#2d5a3a; }
.menu-row-body { padding:10px; background:#faf8f5; }
.menu-enter { text-align:center; padding:9px; background:linear-gradient(135deg,#2d5a3a,#3f7a4e); color:#fff; border-radius:20px; font-size:14px; cursor:pointer; }

/* ---- ⑤ AI 对话 ---- */
.ai-fab { position:sticky; bottom:66px; margin:20px auto 0; width:fit-content; display:flex; align-items:center; padding:9px 20px; background:#fff; border:1px solid #3f7a4e; border-radius:22px; color:#2d5a3a; font-weight:600; font-size:14px; box-shadow:0 2px 8px rgba(63,122,78,.15); cursor:pointer; }
.ai-overlay { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:900; }
.ai-panel { position:fixed; left:50%; bottom:0; transform:translateX(-50%); width:100%; max-width:420px; height:70vh; background:#fff; border-radius:12px 12px 0 0; z-index:901; display:flex; flex-direction:column; overflow:hidden; }
.ai-head { height:44px; display:flex; align-items:center; justify-content:space-between; padding:0 15px; border-bottom:1px solid #eee; font-weight:600; font-size:15px; }
.ai-close { width:20px; height:20px; position:relative; cursor:pointer; }
.ai-close::before, .ai-close::after { content:''; position:absolute; top:50%; left:50%; width:14px; height:2px; background:#999; }
.ai-close::before { transform:translate(-50%,-50%) rotate(45deg); }
.ai-close::after { transform:translate(-50%,-50%) rotate(-45deg); }
.ai-body { flex:1; padding:10px; overflow-y:auto; background:#faf8f5; }
.ai-row { display:flex; margin-bottom:8px; }
.ai-row.right { justify-content:flex-end; }
.ai-row.left { justify-content:flex-start; }
.ai-bubble { max-width:80%; padding:9px 12px; font-size:13px; line-height:1.6; word-break:break-word; }
.ai-row.right .ai-bubble { background:#f9f3e6; border-radius:10px 10px 3px 10px; }
.ai-row.left .ai-bubble { background:#f0f0f0; border-radius:10px 10px 10px 3px; }
.ai-empty { text-align:center; color:#a39a80; font-size:13px; padding:30px 0; }
.ai-input-bar { height:52px; display:flex; align-items:center; padding:0 10px; gap:8px; border-top:1px solid #eee; background:#fff; }
.ai-voice { width:48px; height:36px; border-radius:6px; background:#f5f5f5; display:flex; align-items:center; justify-content:center; font-size:12px; color:#666; flex-shrink:0; cursor:pointer; }
.ai-input { flex:1; height:36px; padding:0 12px; border-radius:6px; border:1px solid #e5e5e5; font-size:13px; outline:none; }
.ai-send { width:60px; height:36px; display:flex; align-items:center; justify-content:center; border-radius:6px; background:linear-gradient(135deg,#2d5a3a,#3f7a4e); color:#fff; font-size:13px; flex-shrink:0; cursor:pointer; }
.ai-send.disabled { background:#d4a574; }

/* ---- 消息页 ---- */
.cat-bar { display:flex; border-bottom:1px solid #eee; margin-bottom:10px; }
.cat-item { flex:1; text-align:center; padding:10px 0; font-size:14px; color:#666; position:relative; cursor:pointer; }
.cat-item.active { color:#2d5a3a; font-weight:600; }
.cat-item.active::after { content:''; position:absolute; bottom:-1px; left:50%; transform:translateX(-50%); width:60%; height:2px; background:#2d5a3a; border-radius:1px; }
.msg-card { padding:10px 12px; margin-bottom:8px; }
.msg-head { display:flex; justify-content:space-between; margin-bottom:4px; }
.msg-author { font-size:13px; font-weight:600; color:#333; }
.msg-time { font-size:10px; color:#999; }
.msg-content { font-size:13px; color:#666; line-height:1.6; }

/* ---- 生活馆页 ---- */
.life-banner { background:linear-gradient(135deg,#2c6e49,#4a9e6f); border-radius:10px; padding:20px 15px; margin-bottom:12px; color:#fff; }
.life-title { font-size:18px; font-weight:700; }
.life-sub { font-size:12px; opacity:.9; margin-top:3px; }
.module-grid { display:flex; flex-wrap:wrap; gap:8px; }
.module-item { width:calc(25% - 6px); background:#FAF8F5; border-radius:10px; padding:10px 4px; display:flex; flex-direction:column; align-items:center; gap:4px; box-sizing:border-box; cursor:pointer; }
.module-icon-wrap { width:32px; height:32px; border-radius:16px; background:#f0e6d3; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.module-icon-img { width:100%; height:100%; object-fit:cover; }
.module-icon-text { font-size:14px; color:#8b6914; }
.module-name { font-size:11px; color:#555; text-align:center; }

/* ---- 我的页 ---- */
.profile-header { background:linear-gradient(135deg,#1a1a1a,#2c1810); padding:20px 15px; display:flex; align-items:center; gap:12px; margin-bottom:12px; border-radius:10px; }
.profile-avatar { width:60px; height:60px; border-radius:30px; background:#f0e6d3; display:flex; align-items:center; justify-content:center; font-size:24px; color:#8b6914; font-weight:600; flex-shrink:0; }
.profile-info { flex:1; }
.profile-nickname { font-size:15px; font-weight:600; color:#f0e6d3; }
.profile-qxid { font-size:12px; color:#b8860b; margin-top:4px; }
.profile-rank { font-size:12px; color:#b8860b; margin-top:2px; }
.my-grid { display:flex; flex-wrap:wrap; gap:8px; padding:0 0 12px; }
.my-item { width:calc(50% - 4px); box-sizing:border-box; background:#fff; border-radius:10px; padding:15px 10px; display:flex; align-items:center; justify-content:center; box-shadow:0 1px 4px rgba(0,0,0,.04); cursor:pointer; }
.my-name { font-size:14px; font-weight:500; }
.my-card { margin-bottom:12px; }
.my-line { padding:13px 4px; border-bottom:1px solid #f5f0eb; font-size:14px; color:#333; cursor:pointer; }
.my-line:last-child { border-bottom:none; }
.my-line-muted { color:#999; cursor:default; }

/* ---- 子模块页 ---- */
.module-card { margin-bottom:8px; }
.card-title { font-size:15px; font-weight:600; color:#2d3a2d; margin-bottom:8px; }
.module-desc { font-size:13px; color:#666; line-height:1.6; }
.template-row { padding:10px 4px; border-bottom:1px solid #f5f0eb; font-size:14px; color:#333; }
.template-row:last-child { border-bottom:none; }
.field-row { padding:8px 4px; border-bottom:1px solid #f5f0eb; }
.field-row:last-child { border-bottom:none; }
.field-label { font-size:14px; font-weight:500; color:#333; }
.field-desc { font-size:12px; color:#8a8a7a; margin-top:2px; }

/* ---- 手机壳视图下：导航栏/tabbar/页脚与壳对齐 ---- */
body.device-phone .shell-nav,
body.device-phone #tabBar,
body.device-phone .site-footer {
  max-width: 420px; margin-left: auto; margin-right: auto;
}
body.device-phone .ai-panel { max-width: 420px; }
/* ---- FILE-001 试测面板（fu-*） ---- */
.fu-stage { border: 1px dashed #d8d2c2; border-radius: 8px; padding: 12px; background: #fdfcf8; margin-bottom: 10px; }
.fu-log-title { font-size: 12px; color: #8a8a7a; margin: 6px 0 4px; }
.fu-log { max-height: 160px; overflow-y: auto; background: #faf8f2; border: 1px solid #eee9dd; border-radius: 8px; padding: 8px 10px; font-family: Consolas, monospace; }
.fu-log-line { font-size: 11px; color: #5a5a4a; padding: 2px 0; border-bottom: 1px dotted #eee9dd; }
.fu-log-line:last-child { border-bottom: none; }
/* ============================================================
   管理台（admin-*）——胡教练专属手机扫码登录
   ============================================================ */
.admin-login { max-width: 340px; margin: 12px auto 30px; text-align: center; }
.admin-brand { padding: 14px 0 18px; }
.admin-logo {
  width: 56px; height: 56px; margin: 0 auto 10px; border-radius: 16px;
  background: linear-gradient(135deg, #1a5fb4, #2d7ad9); color: #fff;
  font-size: 22px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 16px rgba(26,95,180,.3);
}
.admin-brand-name { font-size: 18px; font-weight: 700; color: #2d3a2d; letter-spacing: 1px; }
.admin-brand-sub { font-size: 12px; color: #8a8a7a; margin-top: 4px; }
.admin-qr-wrap {
  background: #fff; border: 1px solid #e4ded0; border-radius: 14px;
  padding: 16px; margin: 0 auto 12px; width: 212px;
}
.admin-qr-wrap canvas { display: block; margin: 0 auto; }
.admin-qr-tip { font-size: 12px; color: #8a8a7a; margin-top: 10px; }
.admin-state {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  font-size: 13px; color: #6a6a5a; margin-bottom: 14px;
}
.admin-state-dot { width: 8px; height: 8px; border-radius: 50%; background: #c9a227; }
.admin-state.ok .admin-state-dot { background: #2d7a3a; }
.admin-state.ok { color: #2d7a3a; }
.admin-actions { display: flex; gap: 8px; justify-content: center; flex-wrap: wrap; }
.admin-demo-tip {
  margin-top: 14px; font-size: 11px; color: #a39a80;
  background: #faf8f2; border: 1px dashed #d8d2c2; border-radius: 8px;
  padding: 8px 10px; line-height: 1.6; text-align: left;
}

/* ---- 管理面板 ---- */
.admin-panel-head {
  display: flex; align-items: center; justify-content: space-between;
  background: linear-gradient(135deg, #1a1a1a, #2c1810);
  border-radius: 10px; padding: 14px 14px; margin-bottom: 12px;
}
.admin-panel-user { display: flex; align-items: center; gap: 10px; }
.admin-panel-avatar {
  width: 42px; height: 42px; border-radius: 21px; background: #f0e6d3;
  display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: #8b6914; font-weight: 700; flex-shrink: 0;
}
.admin-panel-name { font-size: 15px; font-weight: 600; color: #f0e6d3; }
.admin-panel-id { font-size: 11px; color: #b8860b; margin-top: 3px; }
.admin-panel-head .fr-btn-ghost { background: rgba(255,255,255,.12); color: #f0e6d3; border-color: rgba(255,255,255,.3); }
.admin-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 12px; }
.admin-stat {
  background: #fff; border-radius: 10px; padding: 12px 6px; text-align: center;
  box-shadow: 0 1px 4px rgba(0,0,0,.04);
}
.admin-stat-num { font-size: 20px; font-weight: 700; color: #2d5a3a; }
.admin-stat-label { font-size: 11px; color: #8a8a7a; margin-top: 3px; }
.admin-comp-table { width: 100%; border-collapse: collapse; font-size: 12px; }
.admin-comp-table th, .admin-comp-table td { padding: 7px 8px; border-bottom: 1px solid #f0ebe0; text-align: left; }
.admin-comp-table th { color: #8a8a7a; font-weight: 500; font-size: 11px; }
.admin-tag { font-size: 11px; padding: 2px 8px; border-radius: 8px; white-space: nowrap; }
.admin-tag.ready { background: #e2efe2; color: #2d7a3a; }
.admin-tag.todo { background: #f5e9d6; color: #a36a00; }
.admin-links { display: flex; flex-wrap: wrap; gap: 8px; }
.admin-link {
  display: inline-block; padding: 8px 16px; border-radius: 8px;
  background: #f0f5ee; color: #2d5a3a; text-decoration: none; font-size: 13px;
  border: 1px solid #d8e4d4; transition: all .15s;
}
.admin-link:hover { background: #2d5a3a; color: #fff; }
/* ---- 页脚备案信息 ---- */
.footer-icp { margin-top: 4px; }
.footer-icp a { color: #8a8a7a; text-decoration: none; }
.footer-icp a:hover { color: #2d5a3a; }
.footer-tech { margin-top: 5px; font-size: 11px; color: #b8b2a0; }
/* ================= GALLERY-001 图片浏览 ================= */
.gv-stage { height: 420px; overflow-y: auto; background: #f4f6f9; border-radius: 8px; padding: 8px; }
.gv-grid { display: grid; gap: 8px; }
.gv-cell { position: relative; aspect-ratio: 4/3; background: #e8ecf2; border-radius: 6px; overflow: hidden; cursor: pointer; }
.gv-cell img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .2s; }
.gv-cell:hover img { transform: scale(1.04); }
.gv-cell-title { position: absolute; left: 0; right: 0; bottom: 0; padding: 14px 8px 6px; font-size: 12px; color: #fff; background: linear-gradient(transparent, rgba(0,0,0,.55)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gv-del { position: absolute; top: 6px; right: 6px; width: 22px; height: 22px; border: none; border-radius: 50%; background: rgba(0,0,0,.45); cursor: pointer; }
.gv-del::before, .gv-del::after { content: ''; position: absolute; top: 10px; left: 5px; width: 12px; height: 2px; background: #fff; border-radius: 1px; }
.gv-del::before { transform: rotate(45deg); }
.gv-del::after { transform: rotate(-45deg); }
.gv-timeline { padding: 4px 0; }
.gv-item-tl { display: flex; gap: 10px; padding: 8px 4px; border-bottom: 1px solid #eef1f5; }
.gv-tl-time { width: 74px; flex-shrink: 0; font-size: 12px; color: #8a94a6; padding-top: 4px; }
.gv-tl-thumb { width: 88px; height: 66px; flex-shrink: 0; border-radius: 6px; overflow: hidden; cursor: pointer; background: #e8ecf2; }
.gv-tl-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gv-tl-info { flex: 1; min-width: 0; }
.gv-title { font-size: 14px; color: #22303f; margin-bottom: 4px; }
.gv-tl-ops { margin-top: 6px; display: flex; gap: 8px; }
.gv-btn { font-size: 12px; color: #1a5fb4; background: none; border: 1px solid #c9d4e2; border-radius: 4px; padding: 2px 10px; cursor: pointer; }
.gv-btn-del { color: #c0392b; border-color: #e5c3bd; }
.gv-ph { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #98a3b3; font-size: 12px; }
.gv-ph-err { background: #f0f2f5; }
.gv-empty { padding: 48px 0; text-align: center; color: #98a3b3; }
.gv-empty-ico { width: 44px; height: 34px; margin: 0 auto 10px; border: 2px solid #ccd4df; border-radius: 4px; position: relative; }
.gv-empty-ico::before { content: ''; position: absolute; left: 6px; top: 6px; width: 10px; height: 10px; border: 2px solid #ccd4df; border-radius: 50%; }
.gv-empty-txt { font-size: 13px; }
.gv-loading, .gv-more { padding: 12px; text-align: center; font-size: 12px; color: #8a94a6; }
.gv-more-end { color: #b8c1cf; }
.gv-spin { display: inline-block; width: 14px; height: 14px; border: 2px solid #d5dde8; border-top-color: #1a5fb4; border-radius: 50%; animation: fr-spin .8s linear infinite; vertical-align: -2px; margin-right: 6px; }

/* ================= TIMELINE-001 消息时间线 ================= */
.tl-stage { height: 420px; overflow-y: auto; background: #fff; border-radius: 8px; border: 1px solid #eef1f5; }
.tl-list { padding: 4px 0; }
.tl-group-head { display: flex; align-items: center; gap: 8px; padding: 10px 14px 6px; cursor: pointer; user-select: none; }
.tl-arrow { width: 8px; height: 8px; border-right: 2px solid #8a94a6; border-bottom: 2px solid #8a94a6; transform: rotate(-45deg); transition: transform .15s; flex-shrink: 0; }
.tl-arrow-open { transform: rotate(45deg); }
.tl-group-label { font-size: 13px; font-weight: 600; color: #3a4757; }
.tl-group-count { font-size: 11px; color: #98a3b3; background: #eef1f5; border-radius: 8px; padding: 1px 7px; }
.tl-msg { display: flex; gap: 10px; padding: 10px 14px 10px 30px; border-top: 1px solid #f5f7fa; }
.tl-unread { background: #f7faff; }
.tl-msg-ico { width: 32px; height: 32px; border-radius: 50%; flex-shrink: 0; position: relative; background: #e8ecf2; }
.tl-msg-ico::before { content: ''; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); }
.tl-icon-notification { background: #e6f0fb; } .tl-icon-notification::before { width: 14px; height: 12px; border: 2px solid #1a5fb4; border-radius: 3px 3px 7px 7px; }
.tl-icon-task { background: #e8f6ee; } .tl-icon-task::before { width: 11px; height: 11px; border: 2px solid #2d7a3a; border-radius: 2px; }
.tl-icon-update { background: #fdf3e6; } .tl-icon-update::before { width: 0; height: 0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-bottom: 11px solid #b07a1a; }
.tl-icon-approval { background: #e8f6ee; } .tl-icon-approval::before { width: 7px; height: 12px; border-right: 3px solid #2d7a3a; border-bottom: 3px solid #2d7a3a; transform: translate(-50%, -60%) rotate(45deg); }
.tl-icon-system { background: #eef0f4; } .tl-icon-system::before { width: 12px; height: 12px; border: 2px solid #5a6678; border-radius: 50%; }
.tl-icon-mention { background: #eef0f4; } .tl-icon-mention::before { width: 10px; height: 10px; border-radius: 50%; background: #5a6678; box-shadow: -8px 5px 0 -3px #5a6678, 8px 5px 0 -3px #5a6678; }
.tl-icon-invite { background: #f6ecfb; } .tl-icon-invite::before { width: 12px; height: 12px; background: #8e3bb0; transform: translate(-50%, -50%) rotate(45deg); }
.tl-icon-remind { background: #fdf3e6; } .tl-icon-remind::before { width: 4px; height: 12px; background: #b07a1a; border-radius: 2px; box-shadow: 0 12px 0 -2px #b07a1a; }
.tl-icon-chat { background: #e6f0fb; } .tl-icon-chat::before { width: 14px; height: 11px; border: 2px solid #1a5fb4; border-radius: 4px; } .tl-icon-chat::after { content: ''; position: absolute; left: 6px; top: 20px; border: 4px solid transparent; border-top-color: #1a5fb4; }
.tl-icon-default { background: #eef0f4; } .tl-icon-default::before { width: 8px; height: 8px; border-radius: 50%; background: #5a6678; }
.tl-msg-main { flex: 1; min-width: 0; cursor: pointer; }
.tl-msg-top { display: flex; align-items: center; gap: 6px; }
.tl-msg-title { font-size: 14px; color: #22303f; font-weight: 500; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.tl-dot { width: 7px; height: 7px; border-radius: 50%; background: #e05252; flex-shrink: 0; }
.tl-msg-content { font-size: 12px; color: #7a8698; margin-top: 3px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.tl-msg-time { font-size: 11px; color: #b0b9c6; margin-top: 4px; }
.tl-msg-act { flex-shrink: 0; align-self: center; font-size: 12px; color: #1a5fb4; background: #eef4fc; border: none; border-radius: 4px; padding: 5px 10px; cursor: pointer; }
.tl-empty { padding: 48px 0; text-align: center; color: #98a3b3; }
.tl-empty-ico { width: 36px; height: 36px; margin: 0 auto 10px; border-radius: 50%; border: 2px solid #ccd4df; position: relative; }
.tl-empty-ico::before { content: ''; position: absolute; left: 50%; top: 50%; width: 4px; height: 4px; border-radius: 50%; background: #ccd4df; transform: translate(-50%, -50%); box-shadow: 0 8px 0 -1px #ccd4df; }
.tl-empty-txt { font-size: 13px; }
.tl-more { padding: 12px; text-align: center; font-size: 12px; color: #1a5fb4; cursor: pointer; }
.tl-spin { display: inline-block; width: 14px; height: 14px; border: 2px solid #d5dde8; border-top-color: #1a5fb4; border-radius: 50%; animation: fr-spin .8s linear infinite; vertical-align: -2px; margin-right: 6px; }

/* 试测台 checkbox 控件 */
.tb-ctl input[type="checkbox"] { width: 15px; height: 15px; accent-color: #1a5fb4; vertical-align: -2px; margin-right: 4px; }

/* ============ DASH-001 数据看板组件（dashboard） ============ */
.dash-stage { background: #f4f7f2; border: 1px dashed #c8d4c0; border-radius: 8px; padding: 10px; }
.dash-container { padding: 2px; }
.dash-loading { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 36px 0; gap: 10px; color: #8a9a7a; font-size: 13px; }
.dash-spinner { width: 26px; height: 26px; border: 3px solid #e8ede4; border-top-color: #2d7a3a; border-radius: 50%; animation: fr-spin 0.8s linear infinite; }
.dash-loading-text { font-size: 13px; color: #8a9a7a; }
.dash-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.dash-grid.grid-cols-1 .dash-item { flex: 1 1 100%; }
.dash-grid.grid-cols-2 .dash-item { flex: 1 1 calc(50% - 10px); min-width: 280px; }
.dash-item { background: #ffffff; border-radius: 10px; border: 1px solid #e8ede4; overflow: hidden; min-height: 180px; position: relative; }
.dash-container.stack .dash-item { flex: 1 1 100%; margin-bottom: 10px; }
.dash-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 180px; padding: 20px; gap: 6px; }
.dash-empty-symbol { width: 40px; height: 40px; border: 3px dashed #d0d8c8; border-radius: 50%; position: relative; margin-bottom: 6px; }
.dash-empty-symbol::after { content: ''; position: absolute; left: 9px; top: 18px; width: 16px; height: 3px; border-radius: 2px; background: #d0d8c8; }
.dash-empty-title { font-size: 14px; font-weight: 600; color: #1a2a1a; }
.dash-empty-desc { font-size: 12px; color: #b0c0a8; }
.dash-canvas-wrap { width: 100%; padding: 6px; box-sizing: border-box; }
.dash-canvas { display: block; margin: 0 auto; background: #ffffff; border-radius: 6px; max-width: 100%; height: auto; }

/* ============ QR-001 二维码组件（qrcode-service） ============ */
.qr-stage { background: #f4f7f2; border: 1px dashed #c8d4c0; border-radius: 8px; padding: 14px; display: flex; justify-content: center; }
.qr-container { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 12px; background: #ffffff; border-radius: 10px; min-height: 260px; min-width: 260px; }
.qr-loading { display: flex; flex-direction: column; align-items: center; gap: 8px; color: #8a9a7a; font-size: 13px; padding: 40px 0; }
.qr-spinner { width: 26px; height: 26px; border: 3px solid #e8ede4; border-top-color: #2d7a3a; border-radius: 50%; animation: fr-spin 0.8s linear infinite; }
.qr-loading-text { font-size: 13px; }
.qr-error { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 24px 0; }
.qr-state-icon { width: 44px; height: 44px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
.qr-icon-error { background: #fdecec; }
.qr-icon-x { width: 20px; height: 20px; position: relative; }
.qr-icon-x::before, .qr-icon-x::after { content: ''; position: absolute; left: 3px; top: 9px; width: 14px; height: 3px; border-radius: 2px; background: #d9534f; }
.qr-icon-x::before { transform: rotate(45deg); }
.qr-icon-x::after { transform: rotate(-45deg); }
.qr-icon-expired { background: #fff7e6; }
.qr-icon-clock { width: 20px; height: 20px; border: 3px solid #e6a23c; border-radius: 50%; position: relative; }
.qr-icon-clock::before { content: ''; position: absolute; left: 8px; top: 3px; width: 3px; height: 9px; background: #e6a23c; }
.qr-icon-clock::after { content: ''; position: absolute; left: 4px; top: 9px; width: 7px; height: 3px; background: #e6a23c; }
.qr-error-text { font-size: 14px; color: #666; text-align: center; max-width: 240px; }
.qr-btn { margin-top: 6px; padding: 7px 24px; border-radius: 20px; background: #2d7a3a; color: #fff; font-size: 13px; border: none; cursor: pointer; }
.qr-image { border-radius: 8px; background: #f5f7f2; }
.qr-countdown { margin-top: 10px; font-size: 12px; color: #666; }
.qr-countdown-value { color: #d9534f; font-weight: 600; font-family: Consolas, monospace; }
.qr-codeid { margin-top: 6px; font-size: 11px; color: #999; }
.qr-download { margin-top: 10px; padding: 7px 20px; border-radius: 20px; border: 1px solid #2d7a3a; color: #2d7a3a; font-size: 12px; background: transparent; cursor: pointer; }
.qr-download:hover { background: #f0f8ec; }

/* ==================== PUSH-001 push-panel 消息推送面板（V2.1 移植） ==================== */
.push-panel { padding: 8px 0; background: #ffffff; border-radius: 8px; }
/* 权限拒绝 */
.push-permission-denied { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px 15px; gap: 6px; }
.state-icon { width: 36px; height: 36px; border-radius: 50%; background: #fdecec; display: flex; align-items: center; justify-content: center; }
.icon-lock { width: 17px; height: 13px; border: 2px solid #d9534f; border-top: none; border-radius: 2px; position: relative; margin-top: 6px; box-sizing: border-box; }
.icon-lock::before { content: ''; position: absolute; left: 3px; top: -8px; width: 6px; height: 6px; border: 2px solid #d9534f; border-bottom: none; border-radius: 4px 4px 0 0; box-sizing: border-box; }
.denied-title { font-size: 15px; font-weight: 600; color: #d9534f; }
.denied-desc { font-size: 12px; color: #8a9a7a; }
/* 区块 */
.push-section { margin-bottom: 10px; padding: 8px 10px; background: #fafcfa; border-radius: 6px; border: 1px solid #e8ede4; }
.push-section-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.section-title { font-size: 13px; font-weight: 600; color: #1a2a1a; }
.section-actions { display: flex; align-items: center; gap: 6px; }
.select-all { font-size: 11px; color: #2d7a3a; cursor: pointer; }
.count-badge { font-size: 10px; color: #8a9a7a; background: #f0f4ec; padding: 1px 8px; border-radius: 10px; }
.section-hint { font-size: 10px; color: #8a9a7a; }
.char-count { font-size: 10px; color: #8a9a7a; }
/* 目标列表 */
.target-list { display: flex; flex-direction: column; gap: 2px; }
.target-item { display: flex; align-items: center; padding: 6px 7px; border-radius: 5px; background: #ffffff; border: 1px solid #e8ede4; cursor: pointer; }
.target-item:hover { background: #f0f8ec; }
.target-item.selected { border-color: #2d7a3a; background: #f4faf5; }
.target-check { margin-right: 6px; }
.check-box { width: 18px; height: 18px; border: 1px solid #d0d8c8; border-radius: 3px; display: flex; align-items: center; justify-content: center; background: #fff; box-sizing: border-box; }
.check-box.checked { background: #2d7a3a; border-color: #2d7a3a; }
.check-mark { width: 8px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translate(1px, -1px); display: block; }
.target-info { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.target-name { font-size: 12px; color: #1a2a1a; }
.target-type { font-size: 9px; color: #8a9a7a; }
.target-count { font-size: 11px; color: #4a5a4a; flex-shrink: 0; }
.target-empty { padding: 6px 0; font-size: 11px; color: #b0c0a8; }
/* 标签列表 */
.tag-list { display: flex; flex-wrap: wrap; gap: 4px; }
.tag-item { display: flex; align-items: center; gap: 3px; padding: 4px 10px; border-radius: 12px; border: 1px solid #dce4d4; background: #ffffff; font-size: 11px; color: #4a5a4a; cursor: pointer; }
.tag-item:hover { transform: scale(0.96); }
.tag-item.selected { background: #2d7a3a; color: #fff; border-color: #2d7a3a; }
.tag-empty { padding: 6px 0; font-size: 11px; color: #b0c0a8; }
/* 自定义消息 */
.custom-message { width: 100%; min-height: 40px; padding: 6px 8px; border: 1px solid #dce4d4; border-radius: 5px; font-size: 12px; background: #ffffff; resize: none; outline: none; line-height: 1.6; box-sizing: border-box; font-family: inherit; }
.custom-message:focus { border-color: #2d7a3a; }
/* 发送结果 */
.push-result { display: flex; align-items: center; gap: 6px; padding: 8px 10px; border-radius: 5px; margin-bottom: 8px; }
.push-result.success { background: #e8f4e8; border: 1px solid #2d7a3a; }
.push-result.error { background: #fce8e8; border: 1px solid #d9534f; }
.state-circle { width: 22px; height: 22px; border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }
.state-circle.ok { background: #2d7a3a; }
.state-circle.fail { background: #d9534f; }
.push-result .check-mark { width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translate(1px, -1px); display: block; }
.cross-mark { width: 9px; height: 9px; position: relative; display: block; }
.cross-mark::before, .cross-mark::after { content: ''; position: absolute; left: 0; top: 4px; width: 9px; height: 2px; background: #fff; border-radius: 1px; }
.cross-mark::before { transform: rotate(45deg); }
.cross-mark::after { transform: rotate(-45deg); }
.result-text { font-size: 12px; color: #1a2a1a; }
.push-result.error .result-text { color: #d9534f; }
/* 发送按钮 */
.push-send-btn { width: 100%; padding: 10px 0; border-radius: 20px; background: #2d7a3a; color: #fff; font-size: 15px; font-weight: 600; border: none; cursor: pointer; }
.push-send-btn:hover { background: #1a5a2a; }
.push-send-btn.sending { background: #8a9a7a; }
.push-send-btn:disabled { opacity: 0.6; cursor: not-allowed; }
.push-hint { text-align: center; padding: 6px 0 0; font-size: 11px; color: #8a9a7a; }
/* 试测台舞台 */
.ps-stage { padding: 12px 10px; background: #ffffff; border: 1px solid #e8ede4; border-radius: 8px; margin-bottom: 8px; }

/* ==================== TEAM-001 team-chat-window 团队互动窗口（V2.1 移植） ==================== */
.team-chat { display: flex; flex-direction: column; min-height: 200px; background: #f8f6f2; border-radius: 8px; overflow: hidden; position: relative; }
.tc-list { flex: 1; padding: 6px 8px; overflow-y: auto; max-height: 460px; }
.tc-load-more { text-align: center; padding: 6px 0; font-size: 11px; color: #8a9a7a; }
.tc-item { display: flex; margin-bottom: 6px; padding: 0 2px; }
.tc-item.self { flex-direction: row-reverse; }
.tc-item.other { flex-direction: row; }
.tc-avatar { width: 32px; height: 32px; border-radius: 50%; background: #e8ede4; display: flex; align-items: center; justify-content: center; font-size: 14px; color: #4a5a4a; flex-shrink: 0; margin-right: 6px; }
.tc-item.self .tc-avatar { margin-right: 0; margin-left: 6px; }
.tc-content { max-width: 70%; display: flex; flex-direction: column; }
.tc-item.self .tc-content { align-items: flex-end; }
.tc-sender { font-size: 10px; color: #8a9a7a; margin-bottom: 2px; }
.tc-time { margin-left: 5px; font-size: 9px; }
.tc-bubble { padding: 5px 8px; border-radius: 6px; background: #ffffff; border: 1px solid #e8ede4; word-break: break-all; }
.tc-item.self .tc-bubble { background: #2d7a3a; border-color: #2d7a3a; color: #fff; }
.tc-system { text-align: center; color: #8a9a7a; font-size: 11px; padding: 3px 0; background: transparent; border: none; }
.tc-text { font-size: 13px; line-height: 1.6; color: inherit; }
.tc-item.self .tc-text { color: #fff; }
.mention-highlight { color: #2d7a3a; font-weight: 600; }
.mention-highlight.is-member { color: #1a5a8a; text-decoration: underline; text-decoration-style: dotted; }
.tc-item.self .mention-highlight, .tc-item.self .mention-highlight.is-member { color: #c8f0d8; text-decoration: none; }
/* 附件卡片 */
.tc-attachments { margin-top: 4px; display: flex; flex-direction: column; gap: 3px; }
.tc-att-card { display: flex; align-items: center; padding: 4px 6px; background: rgba(255,255,255,0.15); border-radius: 4px; border: 1px solid rgba(255,255,255,0.1); cursor: pointer; }
.tc-item.self .tc-att-card { background: rgba(255,255,255,0.1); border-color: rgba(255,255,255,0.15); }
.tc-ficon { width: 20px; height: 20px; border-radius: 4px; background-color: #e8f2ea; background-size: 60% 60%; background-position: center; background-repeat: no-repeat; flex-shrink: 0; margin-right: 5px; }
.ficon-file { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232d7a3a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E"); }
.tc-att-info { flex: 1; display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.tc-att-name { font-size: 11px; color: inherit; }
.tc-att-size { font-size: 9px; opacity: 0.6; }
.tc-read { font-size: 9px; color: #8a9a7a; margin-top: 2px; text-align: right; cursor: pointer; }
.tc-item.self .tc-read { color: rgba(255,255,255,0.5); }
.tc-time-self { font-size: 9px; color: #8a9a7a; margin-top: 2px; text-align: right; align-self: flex-end; margin-left: 6px; }
/* 空状态 */
.tc-empty { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 30px 0; gap: 6px; }
.tc-empty-symbol { width: 28px; height: 28px; border: 2px dashed #d0d8c8; border-radius: 50%; position: relative; }
.tc-empty-symbol::after { content: ''; position: absolute; left: 6px; top: 13px; width: 12px; height: 2px; border-radius: 1px; background: #d0d8c8; }
.tc-empty-text { font-size: 13px; color: #b0c0a8; }
/* 已读列表弹层 */
.tc-read-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.3); z-index: 400; display: flex; align-items: center; justify-content: center; }
.tc-read-list { background: #fff; border-radius: 8px; padding: 12px 15px; max-width: 250px; width: 80%; max-height: 60%; overflow-y: auto; }
.tc-read-title { font-size: 14px; font-weight: 600; display: block; margin-bottom: 6px; }
.tc-read-item { display: block; padding: 4px 0; font-size: 12px; color: #1a2a1a; border-bottom: 1px solid #f0f0f0; }
.tc-read-empty { color: #8a9a7a; font-size: 11px; text-align: center; padding: 8px 0; }
/* @提及选择器 */
.tc-mention-popup { position: absolute; bottom: 96px; left: 10px; right: 10px; max-height: 120px; background: #fff; border-radius: 6px; box-shadow: 0 2px 10px rgba(0,0,0,0.1); border: 1px solid #e8ede4; overflow-y: auto; z-index: 350; }
.tc-mention-item { display: flex; align-items: center; gap: 6px; padding: 6px 8px; border-bottom: 1px solid #f0f0f0; cursor: pointer; }
.tc-mention-item:hover { background: #f0f8ec; }
.tc-mention-avatar { width: 24px; height: 24px; border-radius: 50%; background: #e8ede4; display: flex; align-items: center; justify-content: center; font-size: 11px; color: #4a5a4a; }
.tc-mention-name { font-size: 12px; color: #1a2a1a; }
.tc-mention-empty { padding: 10px; text-align: center; color: #8a9a7a; font-size: 11px; }
/* 输入区 */
.tc-input-area { border-top: 1px solid #e8ede4; background: #fff; padding: 4px 6px; flex-shrink: 0; }
.tc-att-preview { display: flex; flex-wrap: wrap; gap: 4px; padding: 2px 0 4px; }
.tc-preview-item { display: flex; align-items: center; gap: 3px; padding: 2px 6px; background: #f0f4ec; border-radius: 8px; font-size: 10px; color: #4a5a4a; }
.tc-preview-remove { color: #999; font-size: 12px; padding: 0 2px; cursor: pointer; }
.tc-input-row { display: flex; align-items: center; gap: 4px; }
.tc-attach-btn { font-size: 16px; color: #8a9a7a; padding: 2px 4px; display: flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; background: #f0f4ec; cursor: pointer; flex-shrink: 0; }
.tc-input-field { flex: 1; padding: 6px 8px; border: 1px solid #e0e8d5; border-radius: 15px; font-size: 13px; background: #f8faf6; min-height: 24px; outline: none; box-sizing: border-box; }
.tc-input-field:focus { border-color: #2d7a3a; }
.tc-send-btn { flex-shrink: 0; padding: 5px 12px; border-radius: 15px; border: none; font-size: 13px; color: #8a9a7a; background: #f0f2ec; cursor: pointer; transition: all 0.15s; }
.tc-send-btn.active { background: #2d7a3a; color: #fff; }
.tc-send-btn:hover { transform: scale(0.95); }
/* 试测台舞台 */
.tc-stage { padding: 8px; background: #f8f6f2; border: 1px solid #e8ede4; border-radius: 8px; margin-bottom: 8px; }

/* ==================== INV-001 invitation-maker 邀请函/请柬组件（V2.1 移植） ==================== */
.invitation-maker { padding: 4px 0; background: #f8f5f0; border-radius: 8px; min-height: 200px; }
/* 模板选择 */
.iv-stage-select { padding: 8px; }
.iv-select-header { margin-bottom: 10px; }
.iv-select-title { font-size: 16px; font-weight: 700; color: #2a1a0a; display: block; }
.iv-select-desc { font-size: 12px; color: #8a7a6a; margin-top: 2px; }
.iv-template-scroll { width: 100%; overflow-x: auto; padding: 4px 0 8px; white-space: nowrap; }
.iv-template-list { display: inline-flex; gap: 8px; padding: 0 2px; }
.iv-template-card { width: 100px; flex-shrink: 0; background: #ffffff; border-radius: 8px; border: 2px solid transparent; box-shadow: 0 2px 8px rgba(0,0,0,0.04); overflow: hidden; position: relative; cursor: pointer; transition: all 0.2s; }
.iv-template-card:hover { transform: scale(0.96); }
.iv-template-card.selected { border-color: #c9a86c; box-shadow: 0 2px 12px rgba(201,168,108,0.25); }
.iv-template-preview { height: 70px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 6px; }
.iv-preview-badge { font-size: 9px; opacity: 0.7; color: #fff; }
.iv-preview-title { font-size: 13px; font-weight: 700; margin: 2px 0; }
.iv-preview-style { font-size: 9px; opacity: 0.7; }
.iv-template-info { padding: 6px 7px 7px; display: flex; flex-direction: column; }
.iv-template-name { font-size: 12px; font-weight: 600; color: #2a1a0a; }
.iv-template-style { font-size: 9px; color: #8a7a6a; }
.iv-template-check { position: absolute; top: 4px; right: 4px; width: 20px; height: 20px; border-radius: 50%; background: #c9a86c; display: flex; align-items: center; justify-content: center; }
.iv-check-mark { width: 9px; height: 5px; border-left: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(-45deg) translate(1px, -1px); display: block; }
.iv-select-footer { display: flex; align-items: center; gap: 8px; margin-top: 6px; padding-top: 8px; border-top: 1px solid #e8e0d4; }
.iv-selected-info { flex: 1; font-size: 12px; color: #4a3a2a; }
.iv-btn-generate { padding: 7px 20px; border-radius: 20px; background: #c9a86c; color: #fff; font-size: 14px; font-weight: 600; border: none; cursor: pointer; box-shadow: 0 2px 8px rgba(201,168,108,0.3); }
.iv-btn-generate:hover { opacity: 0.8; }
.iv-btn-generate:disabled { opacity: 0.5; cursor: not-allowed; }
/* 生成中 */
.iv-stage-generating { display: flex; flex-direction: column; align-items: center; padding: 30px 15px 20px; }
.iv-ring { width: 36px; height: 36px; border: 3px solid #e8e0d4; border-top-color: #c9a86c; border-radius: 50%; animation: iv-spin 0.9s linear infinite; }
@keyframes iv-spin { to { transform: rotate(360deg); } }
.iv-gen-title { font-size: 15px; font-weight: 600; color: #2a1a0a; margin-top: 8px; }
.iv-gen-progress { width: 100%; max-width: 200px; margin-top: 12px; display: flex; align-items: center; gap: 8px; }
.iv-progress-bar { flex: 1; height: 4px; border-radius: 2px; background: #e8e0d4; overflow: hidden; }
.iv-progress-fill { height: 100%; border-radius: 2px; background: linear-gradient(90deg, #c9a86c, #e8c88a); transition: width 0.3s ease; }
.iv-progress-text { font-size: 11px; color: #8a7a6a; min-width: 24px; }
.iv-gen-step { font-size: 12px; color: #8a7a6a; margin-top: 6px; }
.iv-btn-cancel { margin-top: 12px; padding: 4px 16px; border-radius: 15px; background: transparent; border: 1px solid #d0c8b8; color: #8a7a6a; font-size: 11px; cursor: pointer; }
/* 预览 */
.iv-stage-preview { padding: 6px 8px 10px; }
.iv-preview-header { text-align: center; margin-bottom: 8px; }
.iv-preview-title { font-size: 15px; font-weight: 700; color: #2d7a3a; }
.iv-preview-sub { font-size: 11px; color: #8a7a6a; }
.iv-phone-frame { width: 170px; height: 270px; margin: 0 auto 8px; background: #1a1a1a; border-radius: 14px; padding: 8px; box-shadow: 0 4px 20px rgba(0,0,0,0.15); position: relative; }
.iv-phone-content { width: 100%; height: 100%; padding: 8px 10px; display: flex; flex-direction: column; overflow-y: auto; font-size: 11px; box-sizing: border-box; border-radius: 8px; }
.iv-phone-page-label { text-align: center; font-size: 9px; opacity: 0.5; padding-bottom: 4px; border-bottom: 1px solid rgba(255,255,255,0.1); flex-shrink: 0; }
.iv-phone-page-preview { flex: 1; overflow-y: auto; padding-top: 4px; font-size: 10px; line-height: 1.6; }
/* 报名表单 */
.iv-phone-form { flex: 1; overflow-y: auto; padding-top: 4px; }
.iv-form-item { margin-bottom: 5px; }
.iv-form-label { font-size: 10px; opacity: 0.7; display: block; margin-bottom: 2px; }
.iv-form-input { width: 100%; height: 26px; border-radius: 4px; border: 1px solid rgba(255,255,255,0.3); background: rgba(255,255,255,0.1); color: inherit; font-size: 11px; padding: 0 6px; box-sizing: border-box; outline: none; }
.iv-register-btn { margin-top: 6px; padding: 6px 0; border-radius: 15px; background: #c9a86c; color: #fff; font-size: 12px; border: none; cursor: pointer; width: 100%; }
.iv-register-done { display: block; text-align: center; font-size: 10px; opacity: 0.8; margin-top: 4px; }
.iv-phone-indicators { position: absolute; bottom: 14px; left: 50%; transform: translateX(-50%); display: flex; gap: 4px; }
.iv-dot { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,0.3); cursor: pointer; }
.iv-dot.active { background: #ffffff; width: 10px; border-radius: 3px; }
.iv-phone-footer { position: absolute; bottom: 4px; right: 12px; font-size: 8px; color: rgba(255,255,255,0.2); }
.iv-preview-actions { display: flex; gap: 6px; margin: 6px 0; }
.iv-preview-actions button { flex: 1; padding: 7px 0; border-radius: 20px; font-size: 12px; border: none; cursor: pointer; }
.iv-btn-outline { background: #f0ece8; color: #4a3a2a; }
.iv-btn-outline:hover { background: #e4e0dc; }
.iv-btn-primary { background: #c9a86c; color: #fff; box-shadow: 0 2px 8px rgba(201,168,108,0.3); }
.iv-btn-primary:hover { opacity: 0.8; }
.iv-qr-section { display: flex; flex-direction: column; align-items: center; padding: 8px; background: #ffffff; border-radius: 8px; border: 1px solid #e8e0d4; margin: 4px 0 6px; }
.iv-qr-label { font-size: 11px; color: #8a7a6a; }
.iv-qr-image { width: 80px; height: 80px; margin: 4px 0; background: #f8f5f0; border-radius: 4px; }
.iv-qr-hint { font-size: 9px; color: #b0a090; }
.iv-btn-save-qr { margin-top: 4px; padding: 4px 16px; border-radius: 15px; background: #f0ece8; color: #4a3a2a; font-size: 10px; border: none; cursor: pointer; }
.iv-preview-footer { display: flex; gap: 8px; justify-content: center; padding: 4px 0; }
.iv-btn-text { padding: 3px 10px; border-radius: 15px; background: transparent; color: #8a7a6a; font-size: 10px; border: none; cursor: pointer; }
.iv-btn-text:hover { background: #f0ece8; }
.iv-error-msg { text-align: center; padding: 8px; color: #d9534f; font-size: 11px; }
.iv-btn-retry { margin-top: 4px; padding: 4px 16px; border-radius: 15px; background: #d9534f; color: #fff; font-size: 11px; border: none; cursor: pointer; }
/* 试测台舞台 */
.iv-stage { padding: 8px; background: #f8f5f0; border: 1px solid #e8ede4; border-radius: 8px; margin-bottom: 8px; }