/**
 * LingVerse · 弹窗公共样式（B 顶 × C 中 / 扁平钮）
 * ─────────────────────────────────────────────────────────────
 * 从确认弹窗 / 红包 / 突破 / 加群等迭代中抽离，后续新弹窗优先复用本文件。
 *
 * 用法速查
 * 1) 标准确认壳（gameConfirm / gameAlert / gamePrompt 与手写一致）：
 *    <div class="modal-content modal--decorated gc-dialog" data-tone="jade|warn|danger">
 *      <div class="gc-head">
 *        <div class="gc-rule" aria-hidden="true"></div>
 *        <div class="gc-title">标题</div>
 *        <!-- 不要 .gc-kicker 副标题；信息放 gc-mid -->
 *      </div>
 *      <div class="gc-mid">… gc-q / gc-sub / gc-loot / gc-detail / gc-irrev / gc-note …</div>
 *      <div class="gc-foot modal-btn-row">
 *        <button class="modal-btn modal-btn--outline">取消</button>
 *        <button class="modal-btn modal-btn--jade gc-foot__ok">确认</button>
 *      </div>
 *    </div>
 *
 * 2) 仅复用「短色条左齐头」的叠卡/表单弹窗（不必挂 gc-dialog）：
 *    <div class="modal-content modal--decorated your-modal">
 *      <div class="gc-head">…同 1…</div>
 *      <div class="modal-body-padded">…业务内容…</div>
 *      <div class="gc-foot">或 modal-btn-row …</div>
 *    </div>
 *    （:has(> .gc-head) 时 padding:0，由 head/mid/foot 自管留白）
 *
 * 3) 按钮：modal-btn + --outline | --jade | --gold | --danger | --orange | --full
 *
 * 铁律（与 Agents.md 一致）
 * - 无左竖条 / 无通栏装饰顶条；短色条 .gc-rule 仅 var(--space-40)
 * - 主钮扁平：浅底 + 描边，无实心渐变 / 无投影
 * - 语义色：jade 正向 · gold 提醒 · danger 不可逆
 *
 * 高度（generic 统一，特殊语义显式登记）
 * - generic 壳 height:auto，仅以视口为上限（约 92dvh）；内容少则矮、多则壳内中区滚动
 * - .gc-mid 不再限 55vh/420px，max-height:none；头/底 flex-shrink:0
 * - 外壳宽度由共享尺寸等级统一：generic compact，复杂桌面内容显式放大，手机收回 compact
 * - embedded / mobile-fullscreen 等特殊高度通过共享 modifier 登记；勿再给 mid 加矮顶高
 *
 * iOS / 旧 WebKit 兼容
 * - 基线样式只用 var()/rgba/hex（iOS 12+ 可用）
 * - color-mix 一律放在 @supports 内作增强；勿单独作为唯一 background/border
 * - 按钮显式 -webkit-appearance:none，避免系统原生钮皮盖过扁平样式
 *
 * 业务专属样式仍放各域文件（如 .bt-dialog、.rp-form、.join-group-channel）
 */

/* showModal 旧头迁入后的 hero 残留 */
.gc-dialog .sm-legacy-hero {
    text-align: center;
    margin: 0 0 var(--space-10);
    line-height: 1.5;
}
.gc-dialog .sm-legacy-hero .modal-header-deco__num {
    font-size: var(--font-page-title);
    font-weight: 700;
    color: var(--text-gold, var(--accent-gold));
}
.gc-dialog .sm-legacy-hero .modal-header-deco__unit {
    font-size: var(--font-label);
    color: var(--text-muted);
    margin-left: var(--space-4);
}
.gc-dialog .sm-plain-mid {
    text-align: center;
    color: var(--text-muted);
    font-size: var(--font-body);
    line-height: 1.7;
    padding: var(--space-8) 0 var(--space-4);
}

/* ═══════════════════════════════════════════════════════════════
   群聊 · 拉人（#5462：C 结果态 + A 道籍名册视觉）
   禁止 sm-legacy-hero / modal-header-deco__num 当群名
   ═══════════════════════════════════════════════════════════════ */
.cgi-mid {
    text-align: left;
}
.cgi-group-chip {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    max-width: 100%;
    margin: 0 0 var(--space-12);
    padding: var(--space-4) var(--space-10);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--text-primary) 3%, transparent);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.4;
}
.cgi-group-chip b {
    font-weight: 500;
    color: var(--text-secondary);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: min(240px, 62vw);
}
.cgi-row {
    display: flex;
    align-items: center;
    gap: var(--space-10);
    padding: var(--space-12) 0;
    border-top: 1px solid color-mix(in srgb, var(--text-primary) 8%, transparent);
}
.cgi-row:first-of-type {
    border-top: none;
    padding-top: var(--space-2);
}
.cgi-row__main {
    flex: 1;
    min-width: 0;
}
.cgi-row__name {
    font-size: var(--font-body-lg);
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.35;
    word-break: break-word;
}
.cgi-row__divine {
    font-weight: 400;
    font-size: var(--font-caption);
    color: var(--text-muted);
    margin-left: var(--space-2);
}
.cgi-row__realm {
    margin-top: var(--space-4);
    font-size: var(--font-caption);
    color: var(--text-secondary);
}
.cgi-row__action {
    flex-shrink: 0;
}
.cgi-tag-in {
    display: inline-block;
    font-size: var(--font-caption);
    color: var(--text-muted);
    padding: var(--space-4) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid color-mix(in srgb, var(--text-primary) 8%, transparent);
    background: color-mix(in srgb, var(--text-primary) 4%, transparent);
    white-space: nowrap;
}
.cgi-status {
    text-align: center;
    padding: var(--space-6) 0 var(--space-2);
}
.cgi-status__badge {
    width: 48px;
    height: 48px;
    margin: 0 auto var(--space-10);
    border-radius: var(--radius-lg);
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: var(--font-serif, "Songti SC", serif);
    font-size: var(--font-heading);
    font-weight: 700;
    color: var(--text-jade, var(--accent-jade));
    background: color-mix(in srgb, var(--accent-jade, #2f6b4f) 12%, transparent);
    border: 1px solid color-mix(in srgb, var(--accent-jade, #2f6b4f) 22%, transparent);
}
.cgi-status__title {
    font-family: var(--font-serif, "Songti SC", serif);
    font-size: var(--font-title);
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: var(--space-6);
}
.cgi-status__desc {
    font-size: var(--font-label);
    color: var(--text-muted);
    line-height: 1.55;
    margin: 0 0 var(--space-12);
}
.cgi-member-mini {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
    text-align: left;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-md, var(--radius-md));
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--text-primary) 2.5%, transparent);
}

/* ═══════════════════════════════════════════════════════════════
   弹窗底部按钮行 + 通用扁平钮
   ═══════════════════════════════════════════════════════════════ */
.modal-btn-row {
    display: flex;
    gap: var(--space-10);
    margin-top: var(--space-16);
}
.modal-btn-row > * { flex: 1; }

.modal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    padding: 0 var(--space-16);
    font-size: var(--font-body);
    border-radius: var(--radius-md, var(--radius-md));
    font-family: inherit;
    cursor: pointer;
    box-sizing: border-box;
    text-decoration: none;
    border: 1px solid transparent;
    box-shadow: none;
    filter: none;
    text-shadow: none;
    /* iOS Safari：未声明 appearance 时，背景若无效会回落成系统原生按钮皮 */
    -webkit-appearance: none;
    appearance: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}
.modal-btn:hover { filter: none; }
.modal-btn:active { opacity: 0.88; }

/* 基线：主题 token / 固定 alpha（不依赖 color-mix） */
.modal-btn--gold {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.12));
    border-color: var(--border-gold, rgba(183, 120, 31, 0.40));
    color: var(--text-gold, var(--accent-gold));
    font-weight: 600;
}
.modal-btn--gold:hover {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.18));
    border-color: var(--border-gold, rgba(183, 120, 31, 0.55));
}
.modal-btn--outline {
    background: transparent;
    border: 1px solid var(--border-color);
    color: var(--text-secondary);
}
.modal-btn--outline:hover {
    background: var(--bg-active, rgba(42, 42, 38, 0.04));
    border-color: var(--border-gold, var(--border-color));
    color: var(--text-primary);
}
.modal-btn--orange {
    background: var(--bg-orange-glass, rgba(154, 107, 61, 0.12));
    border: 1px solid var(--border-orange, rgba(154, 107, 61, 0.40));
    color: var(--accent-orange, #9a6b3d);
}
.modal-btn--orange:hover {
    background: var(--bg-orange-glass, rgba(154, 107, 61, 0.18));
}
.modal-btn--danger {
    background: rgba(183, 58, 49, 0.10);
    border: 1px solid rgba(183, 58, 49, 0.36);
    color: var(--text-danger, var(--accent-crimson));
    font-weight: 600;
}
.modal-btn--danger:hover {
    background: rgba(183, 58, 49, 0.16);
    border-color: rgba(183, 58, 49, 0.48);
}
.modal-btn--jade {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.12));
    border: 1px solid var(--border-jade, rgba(22, 128, 106, 0.40));
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}
.modal-btn--jade:hover {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.18));
    border-color: var(--border-jade, rgba(22, 128, 106, 0.55));
}
.modal-btn--full { width: 100%; }

/* ═══════════════════════════════════════════════════════════════
   gameConfirm / gameAlert / gamePrompt · B顶 × C中（问劫笺）
   顶部：短色条 + 左齐标题；中间：居中主问/代价；底部：语义双钮
   ═══════════════════════════════════════════════════════════════ */
/* 三连选择器压过 game-panels 的
   .modal--decorated:not(:has(> .modal-header-deco)) { padding: var(--space-16) var(--space-20) }
   圆角对齐 B顶×C中 原型 .bc { border-radius: var(--radius-lg) }（全局 --radius-lg 为 12px，须显式覆盖） */
body.game-page .modal-content.modal--decorated.gc-dialog,
.modal-content.modal--decorated.gc-dialog,
.gc-dialog {
    --gc-tone: var(--accent-jade);
    --gc-radius: var(--radius-lg);
    --gc-radius-inner: var(--radius-md);
    --gc-radius-btn: var(--radius-md);
    /* generic 提示/确认默认保持 compact；复杂内容必须显式选择尺寸等级。 */
    --gc-dialog-max-width: var(--pattern-dialog-compact-max-width);
    padding: 0;
    max-width: var(--gc-dialog-max-width);
    /* 以视口而非带 padding 的 overlay 内容盒为基准，避免手机端被二次缩窄。 */
    width: min(var(--pattern-dialog-width), var(--gc-dialog-max-width));
    border-radius: var(--gc-radius);
    /* 基线边框：不用 color-mix，保证旧 iOS 仍有可见描边 */
    border-color: var(--border-gold, var(--border-color));
    /* 实色底板：禁止半透明/透底导致日志与弹窗叠字错位 */
    background: var(--bg-card, var(--bg-panel)) !important;
    background-image: none !important;
    /* 高度自适应：随内容增高，仅视口封顶；中区超出后自滚 */
    display: flex;
    flex-direction: column;
    height: auto;
    max-height: min(var(--pattern-dialog-max-height), calc(100dvh - var(--mobile-popup-safe-top, 24px) - var(--mobile-popup-safe-bottom, 16px) - 16px));
    overflow: hidden;
    isolation: isolate;
    box-sizing: border-box;
}
/*
 * 共享尺寸等级。变量声明用 !important 是为了让末尾最终锁能稳定消费等级，
 * 不是让业务继续覆写外壳 width/max-width。手机 token 会统一收回 392px；
 * fullscreen / embedded 由专用 modifier 在末尾改变几何语义。
 */
.gc-dialog.gc-dialog--medium,
.gc-dialog.sgb-dialog,
.gc-dialog.sgb-dialog--donate-picker,
.gc-dialog.da-dialog,
.gc-dialog.ps-dialog,
.gc-dialog.vb-dialog,
.rf-modal-overlay .gc-dialog.rf-dialog,
.nd-modal-overlay .gc-dialog.nd-dialog,
.gc-dialog.pet-detail-modal,
.gc-dialog.blacklist-modal,
.gc-dialog.bw-dialog,
.gc-dialog.auto-process-dialog,
.gc-dialog.pvp-result-gc,
.gc-dialog.tm-dialog--battle,
.gc-dialog.br-modal,
.gc-dialog.enc-dialog--session,
.gc-dialog.ir-dialog,
.gc-dialog.as-dialog,
.gc-dialog.announce-modal,
.local-combat-replay-modal-overlay .gc-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-medium-max-width) !important;
}
.gc-dialog.gc-dialog--standard,
.gc-dialog.ip-modal--side,
.gc-dialog.eql-dialog,
.gc-dialog.settings-modal,
.gc-dialog.pf-modal,
.gc-dialog.ledger-modal,
.gc-dialog.pawn-dialog,
.gc-dialog.lore-dialog,
.gc-dialog.admin-rm-arc-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-max-width) !important;
}
.gc-dialog.gc-dialog--wide,
.gc-dialog.wash-dialog,
.gc-dialog.wish-modal {
    --gc-dialog-max-width: var(--pattern-dialog-wide-max-width) !important;
}
.gc-dialog.gc-dialog--xwide,
.gc-dialog.xc-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-xwide-max-width) !important;
}
/*
 * 已登记的紧凑子型必须放在全部尺寸族之后；重复 gc-dialog 提高 specificity，
 * 使显式 compact 也能压过带 overlay 前缀的 medium 语义映射。
 */
.gc-dialog.gc-dialog.gc-dialog--compact,
.gc-dialog.sgb-dialog--form,
.gc-dialog.wash-dialog.is-mobile {
    --gc-dialog-max-width: var(--pattern-dialog-compact-max-width) !important;
}
body.game-page .gc-dialog > .gc-head,
body.game-page .gc-dialog > .gc-mid,
body.game-page .gc-dialog > .gc-foot,
.gc-dialog > .gc-head,
.gc-dialog > .gc-mid,
.gc-dialog > .gc-foot {
    background: transparent;
}
body.game-page .gc-dialog > .gc-head,
body.game-page .gc-dialog > .gc-foot,
.gc-dialog > .gc-head,
.gc-dialog > .gc-foot {
    flex-shrink: 0;
}
.gc-dialog[data-tone="warn"] { --gc-tone: var(--accent-gold); }
.gc-dialog[data-tone="danger"] { --gc-tone: var(--accent-crimson); }
.gc-dialog[data-tone="gold"] { --gc-tone: var(--accent-gold); }

/* 头：可单独挂在非 gc-dialog 的 modal--decorated 上（叠卡弹窗） */
.gc-head {
    position: relative;
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline); /* 右侧留给统一关闭 × */
    text-align: left;
    flex-shrink: 0;
}

/* ═══════════════════════════════════════════════════════════════
   统一关闭叉 · 右上角（新版弹窗唯一 × 样式）
   ─────────────────────────────────────────────────────────────
   历史分叉：44 圆钮带阴影 / 30 方角红悬停 / 40 方角铭文紫 / 各 head 微调 top-right
   统一：32 扁平方角、无投影、绝对定位右上；伪元素扩展为 44 命中区。
   底栏「关闭」文字钮仍可保留作次要出口；主关闭入口为右上 ×。
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-header-close,
.modal-header-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: var(--pattern-dialog-close-visual);
    height: var(--pattern-dialog-close-visual);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: transparent;
    color: var(--text-muted);
    appearance: none;
    -webkit-appearance: none;
    font-size: var(--font-heading);
    font-weight: 400;
    line-height: 1;
    cursor: pointer;
    z-index: 3;
    box-shadow: none;
    filter: none;
    text-shadow: none;
    transform: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease, opacity 0.12s ease;
}
body.game-page .modal-header-close:hover,
body.game-page .modal-header-close:focus-visible,
.modal-header-close:hover,
.modal-header-close:focus-visible {
    color: var(--text-primary);
    border-color: var(--border-gold, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    outline: none;
    transform: none;
    box-shadow: none;
}
body.game-page .modal-header-close:active,
.modal-header-close:active {
    opacity: 0.88;
}
body.game-page .modal-header-close::after,
.modal-header-close::after {
    content: "";
    position: absolute;
    inset: calc((var(--pattern-dialog-close-visual) - var(--pattern-touch-target)) / 2);
}

/* 压过各业务弹窗对 × 尺寸/位置/圆角/阴影的分叉覆盖 */
body.game-page .auto-process-modal-overlay .modal-header-close,
body.game-page .inscription-modal-overlay .modal-header-close,
body.game-page .da-head .modal-header-close,
body.game-page .xc-head .modal-header-close,
body.game-page .lf-head .modal-header-close,
body.game-page .tx-head .modal-header-close,
body.game-page .lk-head .modal-header-close,
body.game-page .vb-head .modal-header-close,
body.game-page .rf-head .modal-header-close,
body.game-page .nd-head .modal-header-close,
body.game-page .eql-head .modal-header-close,
body.game-page .er-head .modal-header-close,
body.game-page .pd-head .modal-header-close,
body.game-page .as-head .modal-header-close,
body.game-page .gc-head .modal-header-close,
body.game-page .modal-header-deco .modal-header-close,
body.game-page .craft-gc-head .modal-header-close {
    top: 12px;
    right: 12px;
    width: var(--pattern-dialog-close-visual);
    height: var(--pattern-dialog-close-visual);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: transparent;
    color: var(--text-muted);
    box-shadow: none;
    font-size: var(--font-heading);
}
/* 炼造主壳的 × 与其余 gc-dialog 一致锚定：chrome 内 head 为 static，
   × 由上方压平规则给 top/right 12px，直接落在 chrome（面板）边缘上。 */
body.game-page .craft-modal-chrome .craft-gc-head {
    position: static;
}
body.game-page .auto-process-modal-overlay .modal-header-close:hover,
body.game-page .auto-process-modal-overlay .modal-header-close:focus-visible,
body.game-page .inscription-modal-overlay .modal-header-close:hover,
body.game-page .inscription-modal-overlay .modal-header-close:focus-visible {
    color: var(--text-primary);
    border-color: var(--border-gold, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    transform: none;
}
.gc-rule {
    width: 36px;
    height: 3px;
    border-radius: var(--radius-pill);
    margin-bottom: var(--space-12);
    /* 基线：实色短条；有 color-mix 时再升级为渐变 */
    background: var(--gc-tone, var(--accent-jade));
}
.gc-dialog[data-tone="danger"] .gc-rule {
    background: var(--accent-crimson);
}
.gc-dialog[data-tone="warn"] .gc-rule,
.gc-dialog[data-tone="gold"] .gc-rule {
    background: var(--accent-gold);
}
.gc-title {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--pattern-dialog-title-size);
    letter-spacing: 2px;
    font-weight: 600;
    color: var(--text-primary);
    line-height: 1.35;
}
/* 副标题已退役：新版弹窗只用 gc-title，勿再挂 gc-kicker */
.gc-kicker {
    display: none !important;
}

.gc-mid {
    /* 底边 space-2：与 design-system 弹窗中区「上/水平/下」契约一致（桌面 16/16/2、手机 14/14/2） */
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2);
    text-align: center;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
    flex: 1 1 auto;
    /* 全站放开：中区不设矮顶高；由壳 max-height 约束，内容少则矮 */
    max-height: none;
    width: 100%;
    box-sizing: border-box;
}
.gc-mid.is-form {
    text-align: left;
}
.gc-q {
    font-family: var(--font-serif, "Songti SC", STSong, "Noto Serif SC", serif);
    font-size: var(--font-title);
    line-height: 1.55;
    letter-spacing: 0.5px;
    color: var(--text-primary);
    text-wrap: wrap;
}
.gc-q em,
.gc-q .name {
    font-style: normal;
    color: var(--text-gold);
    font-weight: 600;
}
.gc-sub {
    margin-top: var(--space-8);
    font-size: var(--font-label);
    line-height: 1.65;
    color: var(--text-secondary);
    text-wrap: wrap;
}
.gc-sub .danger { color: var(--accent-crimson); font-weight: 600; }
.gc-title__sub {
    margin-top: var(--space-4);
    font-size: var(--font-label);
    color: var(--text-secondary);
    font-weight: 400;
    line-height: 1.5;
}
.gc-body {
    font-size: var(--font-body);
    line-height: 1.7;
    color: var(--text-secondary);
    white-space: pre-wrap;
    text-wrap: wrap;
    text-align: center;
    max-height: 100%;
}
.gc-body:has(img),
.gc-body:has(.export-png-preview) {
    white-space: normal;
    max-height: none;
}
.export-png-preview__hint {
    margin: 0 0 var(--space-8);
    font-size: var(--font-caption);
    color: var(--text-muted);
    line-height: 1.5;
}
.export-png-preview__img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--radius-sm);
}

.gc-loot {
    margin: var(--space-14) 0 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-8);
}
.gc-loot__item {
    padding: var(--space-10) var(--space-8) var(--space-10);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.gc-loot__k {
    font-size: var(--font-micro);
    letter-spacing: 1px;
    color: var(--text-muted);
}
.gc-loot__v {
    margin-top: var(--space-4);
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    font-size: var(--font-action);
    font-weight: 700;
    color: var(--text-gold);
    font-variant-numeric: tabular-nums;
}

.gc-detail {
    margin: var(--space-14) 0 0;
    padding: var(--space-4) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    text-align: left;
}
.gc-detail__row {
    display: flex;
    justify-content: space-between;
    gap: var(--space-12);
    padding: var(--space-8) 0;
    font-size: var(--font-label);
}
.gc-detail__row + .gc-detail__row {
    border-top: 1px solid var(--border-color);
}
.gc-detail__k { color: var(--text-muted); flex-shrink: 0; }
.gc-detail__v {
    color: var(--text-primary);
    font-weight: 500;
    text-align: right;
}
.gc-detail__v--mono {
    font-family: var(--font-mono, ui-monospace, Menlo, monospace);
    color: var(--text-gold);
    font-weight: 600;
}

.gc-irrev {
    margin: var(--space-12) 0 0;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--gc-radius-btn, var(--radius-md));
    text-align: center;
    font-size: var(--font-caption);
    line-height: 1.5;
    font-weight: 600;
    color: var(--accent-crimson);
    background: rgba(183, 58, 49, 0.08);
    border: 1px solid rgba(183, 58, 49, 0.28);
}
.gc-note {
    margin: var(--space-10) 0 0;
    text-align: center;
    font-size: var(--font-caption);
    line-height: 1.55;
    color: var(--text-muted);
}
.gc-input-wrap {
    margin-top: var(--space-14);
    text-align: left;
}
.gc-input {
    width: 100%;
}
.gc-input-wrap--with-max {
    display: flex;
    align-items: center;
    gap: var(--space-8);
}
.gc-input-wrap--with-max .gc-input {
    flex: 1 1 auto;
    min-width: 0;
    width: auto;
}
.gc-input-max {
    flex: none;
    min-height: 44px;
    min-width: 44px;
    padding: 0 var(--space-8);
    letter-spacing: 0.04em;
}

.gc-foot {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--pattern-dialog-action-gap);
    margin: 0;
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom);
    flex-shrink: 0;
    /* 必须拉满壳宽：否则部分 Android WebView 上 shrink-to-fit，双钮挤成左下内容宽（#6198） */
    width: 100%;
    box-sizing: border-box;
    align-self: stretch;
}
.gc-foot.modal-btn-row { margin-top: 0; }

/*
 * #6300：showDecoratedActionDialog 的 actionClass=modal-action-list 时，
 * 壳为 .gc-foot.da-foot.modal-action-list。.gc-foot 默认 row 会把神行符/传送符
 * 压成横排，右手拇指够不到左侧神行符。多选项列表强制纵向全宽（≥44 触控）。
 * 普通确认双钮（modal-btn-row）仍保持横向。
 */
.gc-foot.modal-action-list,
.gc-dialog > .gc-foot.modal-action-list,
body.game-page .gc-dialog > .gc-foot.modal-action-list {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-8);
}
.gc-foot.modal-action-list > .modal-action-btn,
.gc-foot.modal-action-list > .modal-btn,
.gc-dialog > .gc-foot.modal-action-list > .modal-action-btn,
.gc-dialog > .gc-foot.modal-action-list > .modal-btn,
body.game-page .gc-dialog > .gc-foot.modal-action-list > .modal-action-btn,
body.game-page .gc-dialog > .gc-foot.modal-action-list > .modal-btn {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    min-width: 0;
    min-height: var(--pattern-control-height-comfortable, 44px);
    box-sizing: border-box;
}
/* #6264：听讼等「主操作全宽 + 次行多钮」——modal-btn-row 仍横向，但不被 row 壳挤压 */
.gc-foot.modal-action-list > .modal-btn-row,
.gc-dialog > .gc-foot.modal-action-list > .modal-btn-row,
body.game-page .gc-dialog > .gc-foot.modal-action-list > .modal-btn-row {
    flex: 0 0 auto;
    width: 100%;
    max-width: none;
    min-width: 0;
    display: flex;
    flex-direction: row;
    align-items: stretch;
    gap: var(--pattern-dialog-action-gap, var(--space-10));
    box-sizing: border-box;
}
.gc-foot.modal-action-list > .modal-btn-row > .modal-btn,
.gc-dialog > .gc-foot.modal-action-list > .modal-btn-row > .modal-btn,
body.game-page .gc-dialog > .gc-foot.modal-action-list > .modal-btn-row > .modal-btn {
    flex: 1 1 0%;
    width: auto;
    min-width: 0;
    min-height: var(--pattern-control-height-comfortable, 44px);
    white-space: nowrap;
}
.gc-foot > .modal-btn {
    /* 0% 基线比裸 0 在部分 WebKit/Android 上更稳，避免钮缩成内容宽贴在一起（#6198） */
    flex: 1 1 0%;
    min-width: 0;
    width: 0;
    max-width: none;
    min-height: var(--pattern-control-height-compact, 40px);
    letter-spacing: 1px;
    /* 原型 .btn { border-radius: var(--radius-md) }，覆盖 .modal-btn 的 radius-md 漂移 */
    border-radius: var(--gc-radius-btn, var(--radius-md));
}
.gc-dialog .gc-input,
.gc-dialog .app-input.gc-input {
    border-radius: var(--gc-radius-btn, var(--radius-md));
}
.gc-foot > .gc-foot__ok,
.gc-foot > .modal-btn--full {
    flex: 1.15 1 0%;
}

/* 确认闸口主钮 · 扁平语义（与 outline 取消钮同权结构，靠色区分；无实心渐变/投影） */
.gc-dialog .gc-foot > .modal-btn,
.gc-dialog .gc-foot__ok,
.gc-dialog .modal-btn--full {
    box-shadow: none;
    filter: none;
    text-shadow: none;
}
.gc-dialog .gc-foot__ok.modal-btn--danger,
.gc-dialog .modal-btn--full.modal-btn--danger {
    background: rgba(183, 58, 49, 0.12);
    border: 1px solid rgba(183, 58, 49, 0.40);
    color: var(--text-danger, var(--accent-crimson));
    font-weight: 600;
    box-shadow: none;
}
.gc-dialog .gc-foot__ok.modal-btn--danger:hover,
.gc-dialog .modal-btn--full.modal-btn--danger:hover {
    background: rgba(183, 58, 49, 0.18);
    border-color: rgba(183, 58, 49, 0.55);
}
.gc-dialog .gc-foot__ok.modal-btn--jade,
.gc-dialog .modal-btn--full.modal-btn--jade {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.12));
    border: 1px solid var(--border-jade, rgba(22, 128, 106, 0.40));
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
    box-shadow: none;
}
.gc-dialog .gc-foot__ok.modal-btn--jade:hover,
.gc-dialog .modal-btn--full.modal-btn--jade:hover {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.18));
    border-color: var(--border-jade, rgba(22, 128, 106, 0.55));
}
.gc-dialog .gc-foot__ok.modal-btn--gold,
.gc-dialog .modal-btn--full.modal-btn--gold {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.12));
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.40));
    color: var(--text-gold, var(--accent-gold));
    font-weight: 600;
    box-shadow: none;
}
.gc-dialog .gc-foot__ok.modal-btn--gold:hover,
.gc-dialog .modal-btn--full.modal-btn--gold:hover {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.18));
    border-color: var(--border-gold, rgba(183, 120, 31, 0.55));
}
.gc-dialog .gc-foot > .modal-btn--outline:hover {
    background: var(--bg-active, rgba(42, 42, 38, 0.04));
    border-color: var(--border-gold, var(--border-color));
    color: var(--text-primary);
    filter: none;
}

@media (max-width: 640px) {
    body.game-page .modal-content.modal--decorated.gc-dialog,
    .modal-content.modal--decorated.gc-dialog,
    .gc-dialog {
        max-width: var(--gc-dialog-max-width);
        max-height: min(var(--pattern-dialog-max-height), calc(100dvh - var(--mobile-popup-safe-top, 16px) - var(--mobile-popup-safe-bottom, 12px) - 8px));
    }
    .gc-q { font-size: var(--font-title); }
}

/* 主题层压过：确保 gc 扁平底栏不被通用按钮皮肤盖住（基线 token，无 color-mix） */
body.game-page .gc-dialog .gc-foot > .modal-btn,
body.game-page .gc-dialog .gc-foot > .modal-btn:hover,
body.game-page .gc-dialog .gc-foot > .modal-btn:focus-visible,
body.game-page .gc-dialog .gc-foot__ok,
body.game-page .gc-dialog .modal-btn--full {
    box-shadow: none !important;
    filter: none !important;
    text-shadow: none !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--gold,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--gold,
body.game-page .gc-dialog .modal-btn--full.modal-btn--gold {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.12)) !important;
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.40)) !important;
    color: var(--text-gold, var(--accent-gold)) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--gold:hover,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--gold:hover,
body.game-page .gc-dialog .modal-btn--full.modal-btn--gold:hover {
    background: var(--gradient-gold, rgba(183, 120, 31, 0.18)) !important;
    border-color: var(--border-gold, rgba(183, 120, 31, 0.55)) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--jade,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--jade,
body.game-page .gc-dialog .modal-btn--full.modal-btn--jade {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.12)) !important;
    border: 1px solid var(--border-jade, rgba(22, 128, 106, 0.40)) !important;
    color: var(--text-jade, var(--accent-jade)) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--jade:hover,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--jade:hover,
body.game-page .gc-dialog .modal-btn--full.modal-btn--jade:hover {
    background: var(--gradient-jade, rgba(22, 128, 106, 0.18)) !important;
    border-color: var(--border-jade, rgba(22, 128, 106, 0.55)) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--danger,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--danger,
body.game-page .gc-dialog .modal-btn--full.modal-btn--danger {
    background: rgba(183, 58, 49, 0.12) !important;
    border: 1px solid rgba(183, 58, 49, 0.40) !important;
    color: var(--text-danger, var(--accent-crimson)) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--danger:hover,
body.game-page .gc-dialog .gc-foot__ok.modal-btn--danger:hover {
    background: rgba(183, 58, 49, 0.18) !important;
    border-color: rgba(183, 58, 49, 0.55) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--outline {
    background: transparent !important;
    border: 1px solid var(--border-color) !important;
    color: var(--text-secondary) !important;
}
body.game-page .gc-dialog .gc-foot > .modal-btn--outline:hover {
    background: var(--bg-active, rgba(42, 42, 38, 0.04)) !important;
    border-color: var(--border-gold, var(--border-color)) !important;
    color: var(--text-primary) !important;
}

/* ═══════════════════════════════════════════════════════════════
   color-mix 增强层（Safari 16.2+ / 现代 Chrome）
   旧 iOS 整块跳过，基线 token 样式继续生效
   ═══════════════════════════════════════════════════════════════ */
@supports (color: color-mix(in srgb, red 50%, blue)) {
    .modal-btn--gold {
        background: color-mix(in srgb, var(--accent-gold) 12%, transparent);
        border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent);
    }
    .modal-btn--gold:hover {
        background: color-mix(in srgb, var(--accent-gold) 18%, transparent);
        border-color: color-mix(in srgb, var(--accent-gold) 55%, transparent);
    }
    .modal-btn--outline:hover {
        background: color-mix(in srgb, var(--text-primary) 4%, transparent);
        border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    }
    .modal-btn--orange {
        background: color-mix(in srgb, var(--accent-orange, #9a6b3d) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-orange, #9a6b3d) 40%, transparent);
    }
    .modal-btn--orange:hover {
        background: color-mix(in srgb, var(--accent-orange, #9a6b3d) 18%, transparent);
    }
    .modal-btn--danger {
        background: color-mix(in srgb, var(--jimo-crimson, var(--accent-crimson)) 10%, transparent);
        border: 1px solid color-mix(in srgb, var(--jimo-crimson, var(--accent-crimson)) 36%, transparent);
    }
    .modal-btn--danger:hover {
        background: color-mix(in srgb, var(--jimo-crimson, var(--accent-crimson)) 16%, transparent);
        border-color: color-mix(in srgb, var(--jimo-crimson, var(--accent-crimson)) 48%, transparent);
    }
    .modal-btn--jade {
        background: color-mix(in srgb, var(--accent-jade) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-jade) 40%, transparent);
    }
    .modal-btn--jade:hover {
        background: color-mix(in srgb, var(--accent-jade) 18%, transparent);
        border-color: color-mix(in srgb, var(--accent-jade) 55%, transparent);
    }

    body.game-page .modal-content.modal--decorated.gc-dialog,
    .modal-content.modal--decorated.gc-dialog,
    .gc-dialog {
        border-color: color-mix(in srgb, var(--gc-tone) 22%, var(--border-color));
    }
    .gc-rule {
        background: linear-gradient(
            90deg,
            var(--gc-tone, var(--accent-jade)),
            color-mix(in srgb, var(--accent-gold) 70%, transparent)
        );
    }
    .gc-dialog[data-tone="danger"] .gc-rule {
        background: linear-gradient(
            90deg,
            var(--accent-crimson),
            color-mix(in srgb, var(--accent-gold) 50%, transparent)
        );
    }
    .gc-dialog[data-tone="warn"] .gc-rule,
    .gc-dialog[data-tone="gold"] .gc-rule {
        background: linear-gradient(
            90deg,
            var(--accent-gold),
            color-mix(in srgb, var(--accent-crimson) 40%, transparent)
        );
    }
    .gc-detail__row + .gc-detail__row {
        border-top: 1px dashed color-mix(in srgb, var(--border-color) 85%, transparent);
    }
    .gc-irrev {
        background: color-mix(in srgb, var(--accent-crimson) 8%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-crimson) 28%, var(--border-color));
    }

    .gc-dialog .gc-foot__ok.modal-btn--danger,
    .gc-dialog .modal-btn--full.modal-btn--danger {
        background: color-mix(in srgb, var(--accent-crimson) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-crimson) 40%, transparent);
    }
    .gc-dialog .gc-foot__ok.modal-btn--danger:hover,
    .gc-dialog .modal-btn--full.modal-btn--danger:hover {
        background: color-mix(in srgb, var(--accent-crimson) 18%, transparent);
        border-color: color-mix(in srgb, var(--accent-crimson) 55%, transparent);
    }
    .gc-dialog .gc-foot__ok.modal-btn--jade,
    .gc-dialog .modal-btn--full.modal-btn--jade {
        background: color-mix(in srgb, var(--accent-jade) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-jade) 40%, transparent);
    }
    .gc-dialog .gc-foot__ok.modal-btn--jade:hover,
    .gc-dialog .modal-btn--full.modal-btn--jade:hover {
        background: color-mix(in srgb, var(--accent-jade) 18%, transparent);
        border-color: color-mix(in srgb, var(--accent-jade) 55%, transparent);
    }
    .gc-dialog .gc-foot__ok.modal-btn--gold,
    .gc-dialog .modal-btn--full.modal-btn--gold {
        background: color-mix(in srgb, var(--accent-gold) 12%, transparent);
        border: 1px solid color-mix(in srgb, var(--accent-gold) 40%, transparent);
    }
    .gc-dialog .gc-foot__ok.modal-btn--gold:hover,
    .gc-dialog .modal-btn--full.modal-btn--gold:hover {
        background: color-mix(in srgb, var(--accent-gold) 18%, transparent);
        border-color: color-mix(in srgb, var(--accent-gold) 55%, transparent);
    }
    .gc-dialog .gc-foot > .modal-btn--outline:hover {
        background: color-mix(in srgb, var(--text-primary) 4%, transparent);
        border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    }

    body.game-page .gc-dialog .gc-foot > .modal-btn--gold,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--gold,
    body.game-page .gc-dialog .modal-btn--full.modal-btn--gold {
        background: color-mix(in srgb, var(--accent-gold) 12%, transparent) !important;
        border: 1px solid color-mix(in srgb, var(--accent-gold) 40%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--gold:hover,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--gold:hover,
    body.game-page .gc-dialog .modal-btn--full.modal-btn--gold:hover {
        background: color-mix(in srgb, var(--accent-gold) 18%, transparent) !important;
        border-color: color-mix(in srgb, var(--accent-gold) 55%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--jade,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--jade,
    body.game-page .gc-dialog .modal-btn--full.modal-btn--jade {
        background: color-mix(in srgb, var(--accent-jade) 12%, transparent) !important;
        border: 1px solid color-mix(in srgb, var(--accent-jade) 40%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--jade:hover,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--jade:hover,
    body.game-page .gc-dialog .modal-btn--full.modal-btn--jade:hover {
        background: color-mix(in srgb, var(--accent-jade) 18%, transparent) !important;
        border-color: color-mix(in srgb, var(--accent-jade) 55%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--danger,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--danger,
    body.game-page .gc-dialog .modal-btn--full.modal-btn--danger {
        background: color-mix(in srgb, var(--accent-crimson) 12%, transparent) !important;
        border: 1px solid color-mix(in srgb, var(--accent-crimson) 40%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--danger:hover,
    body.game-page .gc-dialog .gc-foot__ok.modal-btn--danger:hover {
        background: color-mix(in srgb, var(--accent-crimson) 18%, transparent) !important;
        border-color: color-mix(in srgb, var(--accent-crimson) 55%, transparent) !important;
    }
    body.game-page .gc-dialog .gc-foot > .modal-btn--outline:hover {
        background: color-mix(in srgb, var(--text-primary) 4%, transparent) !important;
        border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color)) !important;
    }
}

/* ═══════════════════════════════════════════════════════════════
   道体登记 / 道体重塑（gc-dialog 族 · 三选一）
   ═══════════════════════════════════════════════════════════════ */
/* 外壳宽高由 .gc-dialog 几何契约统一提供（compact 392 / 登记等级）。 */
.gd-mid {
    padding-top: var(--space-12);
}
.gd-status {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.gd-status__k {
    font-size: var(--font-caption);
    letter-spacing: 1px;
    color: var(--text-muted);
    flex-shrink: 0;
}
.gd-status__v {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-title);
    font-weight: 600;
    letter-spacing: 2px;
    color: var(--text-jade, var(--accent-jade));
}
.gd-status__v.is-empty {
    color: var(--text-muted);
    font-weight: 500;
    letter-spacing: 1px;
}
.gd-dialog[data-tone="gold"] .gd-status__v:not(.is-empty) {
    color: var(--text-gold, var(--accent-gold));
}
.gd-mid .gc-sub {
    margin-top: var(--space-10);
    margin-bottom: 0;
}
.gd-opts {
    display: grid;
    gap: var(--space-8);
    margin-top: var(--space-14);
}
.gd-opt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-12);
    width: 100%;
    min-height: 56px;
    padding: var(--space-12) var(--space-14);
    border-radius: var(--gc-radius-inner, var(--radius-md));
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
    color: var(--text-primary);
    font: inherit;
    text-align: left;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    transition: background 0.12s ease, border-color 0.12s ease, color 0.12s ease;
}
.gd-opt__main {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    min-width: 0;
}
.gd-opt__label {
    font-family: var(--font-serif, "Songti SC", STSong, serif);
    font-size: var(--font-title);
    font-weight: 600;
    letter-spacing: 3px;
    line-height: 1.3;
}
.gd-opt__hint {
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 1px;
}
.gd-opt__meta {
    flex-shrink: 0;
    font-size: var(--font-label);
    letter-spacing: 0.5px;
    color: var(--text-muted);
    white-space: nowrap;
}
.gd-opt.is-pick:hover,
.gd-opt.is-reshape:hover {
    border-color: color-mix(in srgb, var(--accent-jade) 42%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 8%, var(--bg-panel));
}
.gd-dialog[data-tone="gold"] .gd-opt.is-reshape:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 8%, var(--bg-panel));
}
.gd-opt.is-pick .gd-opt__meta {
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}
.gd-opt.is-reshape .gd-opt__meta {
    color: var(--text-gold, var(--accent-gold));
    font-weight: 600;
}
.gd-opt.is-current {
    border-color: color-mix(in srgb, var(--accent-jade) 36%, var(--border-color));
    background: color-mix(in srgb, var(--accent-jade) 10%, var(--bg-panel));
    cursor: default;
}
.gd-dialog[data-tone="gold"] .gd-opt.is-current {
    border-color: color-mix(in srgb, var(--accent-gold) 36%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 10%, var(--bg-panel));
}
.gd-opt.is-current .gd-opt__label {
    color: var(--text-jade, var(--accent-jade));
}
.gd-dialog[data-tone="gold"] .gd-opt.is-current .gd-opt__label {
    color: var(--text-gold, var(--accent-gold));
}
.gd-opt.is-current .gd-opt__meta {
    color: var(--text-jade, var(--accent-jade));
    font-weight: 600;
}
.gd-dialog[data-tone="gold"] .gd-opt.is-current .gd-opt__meta {
    color: var(--text-gold, var(--accent-gold));
}
.gd-opt.is-disabled:not(.is-current) {
    opacity: 0.55;
    cursor: not-allowed;
}
.gd-opt:disabled {
    cursor: not-allowed;
}
.gd-opt:active:not(:disabled):not(.is-disabled) {
    opacity: 0.92;
}
.gd-mid .gc-note {
    margin-top: var(--space-12);
}

/* ═══════════════════════════════════════════════════════════════
   showDecoratedActionDialog · 通用操作笺（da-dialog / gc 工厂）
   subtitle→gc-title；valueHtml/descHtml 入 mid；actionsHtml 入 foot
   ═══════════════════════════════════════════════════════════════ */
body.game-page .modal-content.modal--decorated.gc-dialog.da-dialog,
.modal-content.modal--decorated.gc-dialog.da-dialog,
.gc-dialog.da-dialog {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 0;
    background: var(--bg-card, var(--bg-panel)) !important;
}
.da-head {
    position: relative;
    padding: var(--space-16) var(--space-48) var(--space-8) var(--space-16);
    flex-shrink: 0;
    background: var(--bg-card, var(--bg-panel));
    z-index: 1;
}
.da-head .gc-rule { margin-bottom: var(--space-10); }
/* 关闭 × 样式见文件顶部统一 .modal-header-close */
body.game-page .gc-dialog.da-dialog .gc-mid.da-mid,
.gc-dialog.da-dialog .gc-mid.da-mid,
.da-mid {
    flex: 1 1 auto;
    min-height: 0;
    max-height: none;
    text-align: left;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    padding: var(--space-4) var(--space-14) var(--space-12);
    scrollbar-width: none;
}
.da-mid::-webkit-scrollbar { display: none; }
.da-hero {
    text-align: center;
    margin: 0 0 var(--space-10);
    font-variant-numeric: tabular-nums;
}
.da-hero .modal-header-deco__num {
    font-size: var(--font-page-title);
    font-weight: 700;
    line-height: 1.2;
    color: var(--text-primary);
}
.da-desc {
    margin: 0 0 var(--space-10);
    text-align: center;
}
.da-foot {
    flex-shrink: 0;
    margin-top: 0;
    padding: var(--space-10) var(--space-14) max(var(--space-12), env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--border-color);
    background: var(--bg-card);
}

/* ═══════════════════════════════════════════════════════════════
   神识耗尽软着陆 · 信息摘要 + 步骤卡
   不再把多段说明直接堆成大号粗体文本，移动端优先保持可扫读。
   ═══════════════════════════════════════════════════════════════ */
.da-mid.spirit-soft-landing-body {
    padding: var(--space-8) var(--space-14) var(--space-14);
}
.spirit-soft-landing {
    display: grid;
    gap: var(--space-12);
    text-align: left;
}
.spirit-soft-landing__summary {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    flex-wrap: wrap;
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.34));
    border-radius: var(--radius-md);
    background: var(--bg-glass, rgba(183, 120, 31, 0.06));
}
.spirit-soft-landing__status,
.spirit-soft-landing__badge {
    display: inline-flex;
    align-items: center;
    min-height: 22px;
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    font-size: var(--font-micro);
    line-height: 1.2;
    letter-spacing: .04em;
    white-space: nowrap;
}
.spirit-soft-landing__status {
    color: var(--text-gold, var(--accent-gold));
    background: rgba(183, 120, 31, 0.12);
}
.spirit-soft-landing__summary-text {
    color: var(--text-secondary);
    font-size: var(--font-caption);
    line-height: 1.45;
}
.spirit-soft-landing__badge {
    margin-left: auto;
    color: var(--text-muted);
    border: 1px solid var(--border-color);
    background: var(--bg-panel);
}
.spirit-soft-landing__reason {
    color: var(--text-primary);
    font-size: var(--font-body);
    font-weight: 500;
    line-height: 1.65;
}
.spirit-soft-landing__section-label {
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-caption);
    font-weight: 600;
    letter-spacing: .08em;
}
.spirit-soft-landing__options {
    display: grid;
    gap: var(--space-8);
}
.spirit-soft-landing__option {
    display: flex;
    align-items: flex-start;
    gap: var(--space-10);
    padding: var(--space-10) var(--space-12);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: var(--bg-panel);
}
.spirit-soft-landing__index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 26px;
    width: 26px;
    height: 26px;
    border: 1px solid var(--border-gold, rgba(183, 120, 31, 0.36));
    border-radius: var(--radius-md);
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-micro);
    font-variant-numeric: tabular-nums;
}
.spirit-soft-landing__option-copy {
    display: grid;
    gap: var(--space-4);
    min-width: 0;
}
.spirit-soft-landing__option-copy strong {
    color: var(--text-primary);
    font-size: var(--font-label);
    font-weight: 600;
    line-height: 1.35;
}
.spirit-soft-landing__option-copy span {
    color: var(--text-muted);
    font-size: var(--font-caption);
    line-height: 1.45;
}

@media (max-width: 640px) {
    .da-mid.spirit-soft-landing-body {
        padding: var(--space-6) var(--space-12) var(--space-12);
    }
    .spirit-soft-landing {
        gap: var(--space-10);
    }
    .spirit-soft-landing__reason {
        font-size: var(--font-label);
    }
    .spirit-soft-landing__option {
        padding: var(--space-10) var(--space-10);
    }
}

/* ═══════════════════════════════════════════════════════════════
   最终几何锁：game-dialog.css 必须是含弹窗页面最后加载的样式表。

   历史业务 CSS 含有高优先级甚至 !important 的宽度、头/中/底间距分叉；
   重复类选择器只用于提高旧浏览器也支持的 specificity，最终数值仍全部来自
   --pattern-dialog-*；桌面与手机的宽度值只在 game-base.css 中维护。
   新增业务样式不得依赖覆盖本段。
   ═══════════════════════════════════════════════════════════════ */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog {
    box-sizing: border-box !important;
    width: min(var(--pattern-dialog-width), var(--gc-dialog-max-width)) !important;
    max-width: var(--gc-dialog-max-width) !important;
    padding: 0 !important;
    border-radius: var(--radius-lg) !important;
    display: flex !important;
    flex-direction: column !important;
    /* #7140：最终锁必须钉实色底，业务 color-mix / 主题半透明不得把壳冲穿 */
    background: var(--bg-card, var(--bg-panel)) !important;
    background-image: none !important;
    isolation: isolate !important;
}

/* #7140：不支持 color-mix 的旧引擎丢掉半透明声明后，弹窗会透出底层日志叠字 */
@supports not (color: color-mix(in srgb, #000 50%, #fff)) {
    html body .gc-dialog,
    html body .modal-content,
    html body .modal-content.modal--decorated {
        background: var(--bg-card, var(--bg-panel)) !important;
        background-image: none !important;
    }
}
/* gc-dialog 也可只复用外观并嵌在页面中；这类壳不参与 modal 视口几何。 */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog--embedded {
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    max-height: none !important;
}
/* 主工作台在手机端使用真正的视口全屏；不要把此 modifier 挂到许愿等自适应底靠弹窗。 */
@media (max-width: 620px) {
    html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog--mobile-fullscreen {
        width: 100vw !important;
        max-width: none !important;
        height: 100dvh !important;
        max-height: 100dvh !important;
        border-radius: 0 !important;
    }
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-head {
    padding: var(--pattern-dialog-head-top) var(--pattern-dialog-close-reserve) 0 var(--pattern-dialog-head-inline) !important;
    flex-shrink: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-head .gc-title {
    font-size: var(--pattern-dialog-title-size) !important;
    font-weight: 600 !important;
    letter-spacing: 2px !important;
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-mid {
    padding: var(--pattern-dialog-mid-top) var(--pattern-dialog-mid-inline) var(--space-2) !important;
    min-height: 0 !important;
    max-height: none !important;
    flex: 1 1 auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
}
/* 底栏：横排等分拉满，禁止再缩成左下「取消确定」贴条（#6198） */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot {
    display: flex !important;
    flex-direction: row !important;
    align-items: stretch !important;
    gap: var(--pattern-dialog-action-gap) !important;
    margin: 0 !important;
    padding: var(--pattern-dialog-foot-top) var(--pattern-dialog-foot-inline) var(--pattern-dialog-foot-bottom) !important;
    flex-shrink: 0 !important;
    width: 100% !important;
    box-sizing: border-box !important;
    align-self: stretch !important;
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot > .modal-btn {
    flex: 1 1 0% !important;
    min-width: 0 !important;
    width: 0 !important;
    max-width: none !important;
    min-height: var(--pattern-control-height-compact, 40px) !important;
    box-sizing: border-box !important;
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot > .gc-foot__ok,
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot > .modal-btn--full {
    flex: 1.15 1 0% !important;
}
/*
 * #6588：同郡非相邻的神行符/传送符走 modal-action-list。
 * 上面的最终锁会把所有 .gc-foot 打回横排，三钮挤成一行后有一张点不到。
 * 列表底栏必须压过该锁，保持纵向全宽。
 */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot.modal-action-list {
    flex-direction: column !important;
    align-items: stretch !important;
}
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot.modal-action-list > .modal-action-btn,
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog > .gc-foot.modal-action-list > .modal-btn {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    min-height: var(--pattern-control-height-comfortable, 44px) !important;
}

/*
 * ===== 业务档位登记（几何锁管辖；业务 CSS 不得再覆写外壳 width/max-width） =====
 * 玄筹阁 xc-dialog：桌面 wide 720，≥900px 升 xwide 960（内容三栏扩展），手机由统一手机锁回收 392。
 * 原 game-panels.css 以 width !important 击穿本锁的写法已回收（#design-audit M7）。
 */
.gc-dialog.xc-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-wide-max-width) !important;
}
@media (min-width: 900px) {
    .gc-dialog.xc-dialog {
        --gc-dialog-max-width: var(--pattern-dialog-xwide-max-width) !important;
    }
}
/* 洗炼工作台 wash-dialog：wide 720（设计系统 7.1 登记档）；手机回收 392。 */
.gc-dialog.wash-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-wide-max-width) !important;
}
/* 天道仙缘 xy-dialog：桌面 wide 720 宽弹窗（底栏渠道矩阵随宽铺开、消耗页双列）；手机回收 392。 */
.gc-dialog.xy-dialog {
    --gc-dialog-max-width: var(--pattern-dialog-wide-max-width) !important;
}
/* 手机统一回收：xc/wash/xy 手机视口回到 compact 392（与 is-mobile 紧凑段双保险）。 */
@media (max-width: 640px) {
    .gc-dialog.xc-dialog,
    .gc-dialog.wash-dialog,
    .gc-dialog.xy-dialog {
        --gc-dialog-max-width: var(--pattern-dialog-compact-max-width) !important;
    }
}

/* #9676 后续排查：无底栏（gc-foot 缺位）的纯展示弹窗，中区底距补足。
 * gc-mid 底边 space-2 是给 foot 让位的契约值；foot 不存在时由 mid 自身提供弹窗底距，
 * 否则内容贴底。锁级与上方最终锁一致，保证不被压掉。 */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog:not(:has(> .gc-foot)) > .gc-mid {
    padding-bottom: var(--pattern-dialog-foot-bottom) !important;
}
/* JS 双保险（同 #9676 排查）：normalize 完成后打 gc-dialog--nofoot，不依赖浏览器 :has() 支持 */
html body .gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog.gc-dialog--nofoot > .gc-mid {
    padding-bottom: var(--pattern-dialog-foot-bottom) !important;
}
