/* ============================================================
 *  邂逅会话（v3 · gc-dialog 落地）
 *  对齐 design-demos/encounter-redesign · 圆角不得漂移：
 *    壳 14 / 卡·聊·提议 12 / 动作钮 10 / 输入·小钮 8 / 胶囊 999
 * ============================================================ */

/* 与 gc-dialog 对齐：壳 14px */
body.game-page .modal-content.modal--decorated.gc-dialog.enc-dialog,
.modal-content.modal--decorated.gc-dialog.enc-dialog,
.gc-dialog.enc-dialog {
    --gc-radius: var(--radius-lg);
    --gc-radius-inner: var(--radius-lg);
    --gc-radius-btn: var(--radius-md);
    padding: 0;
    border-radius: var(--radius-lg);
}

body.game-page .modal-content.modal--decorated.gc-dialog.enc-dialog.enc-dialog--session,
.modal-content.modal--decorated.gc-dialog.enc-dialog.enc-dialog--session,
.gc-dialog.enc-dialog.enc-dialog--session {
    border-radius: var(--radius-lg);
}

/* ---------- head ---------- */
body.game-page .gc-dialog.enc-dialog > .gc-head.enc-head,
.gc-dialog.enc-dialog > .gc-head.enc-head,
.enc-head {
    position: relative;
    padding: var(--space-14) var(--space-48) var(--space-6) var(--space-14);
    text-align: left;
    flex-shrink: 0;
}
.enc-head .gc-rule { margin-bottom: var(--space-8); }
.enc-head .gc-title {
    color: var(--text-gold, var(--accent-gold));
    font-size: var(--font-title);
    letter-spacing: 0.1em;
}
.enc-dialog[data-tone="danger"] .enc-head .gc-title {
    color: var(--text-danger, var(--accent-crimson));
}
.enc-dialog[data-tone="danger"] .gc-rule {
    background: var(--accent-crimson);
}
.enc-head .modal-header-close {
    position: absolute;
    top: 6px;
    right: 6px;
    width: 40px;
    height: 40px;
    border-radius: var(--radius-md);
}

/* ---------- mid（压过 .gc-mid 后载规则） ---------- */
body.game-page .gc-dialog.enc-dialog > .gc-mid.enc-mid,
.gc-dialog.enc-dialog > .gc-mid.enc-mid,
.enc-mid {
    display: flex;
    flex-direction: column;
    gap: var(--space-10);
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    text-align: left;
    white-space: normal;
}
body.game-page .gc-dialog.enc-dialog.enc-dialog--session > .gc-mid.enc-mid,
.gc-dialog.enc-dialog.enc-dialog--session > .gc-mid.enc-mid {
    gap: var(--space-8);
}

/* ---------- foot ---------- */
body.game-page .gc-dialog.enc-dialog > .gc-foot.enc-foot,
.gc-dialog.enc-dialog > .gc-foot.enc-foot,
.enc-foot {
    flex-shrink: 0;
    display: flex;
    gap: var(--space-8);
    margin: 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);
}
.enc-foot .modal-btn {
    flex: 1;
    border-radius: var(--radius-md);
}

/* mid 内子块勿 shrink */
.enc-lead,
.enc-card,
.enc-pending,
.enc-list,
.enc-price,
.enc-sec-head,
.enc-id,
.enc-acts,
.enc-invite-actions,
.enc-irrev {
    flex-shrink: 0;
}

/* ---------- lead / cards · 12px ---------- */
.enc-lead {
    margin: 0;
    font-size: var(--font-label);
    line-height: 1.6;
    color: var(--text-muted);
    text-align: left;
}
.enc-card {
    padding: var(--space-12) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    text-align: left;
}
.enc-card--soft {
    background: color-mix(in srgb, var(--accent-gold) 6%, transparent);
    border-color: color-mix(in srgb, var(--accent-gold) 22%, var(--border-color));
}
.enc-card--danger {
    background: color-mix(in srgb, var(--accent-crimson) 8%, transparent);
    border-color: color-mix(in srgb, var(--accent-crimson) 32%, var(--border-color));
}
.enc-card__lab {
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.1em;
    color: var(--text-muted);
    margin-bottom: var(--space-4);
}
.enc-card__title {
    font-size: var(--font-body-lg);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
}
.enc-card__meta {
    margin-top: var(--space-6);
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-6);
}
.enc-card__body {
    margin-top: var(--space-8);
    font-size: var(--font-label);
    line-height: 1.6;
    color: var(--text-secondary);
}

/* ---------- stamps · 999 ---------- */
.enc-stamp {
    display: inline-flex;
    align-items: center;
    gap: var(--space-4);
    padding: var(--space-2) var(--space-8);
    border-radius: var(--radius-pill);
    border: 1px solid var(--border-color);
    font-size: var(--font-caption);
    color: var(--text-muted);
    letter-spacing: 0.04em;
    line-height: 1.4;
}
.enc-stamp--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 40%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 10%, transparent);
}
.enc-stamp--jade {
    color: var(--text-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 40%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 10%, transparent);
}
.enc-stamp--warn {
    color: var(--accent-orange, #9a6b3d);
    border-color: color-mix(in srgb, var(--accent-orange, #9a6b3d) 38%, transparent);
    background: color-mix(in srgb, var(--accent-orange, #9a6b3d) 10%, transparent);
}
.enc-stamp--danger {
    color: var(--text-danger);
    border-color: color-mix(in srgb, var(--accent-crimson) 40%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 10%, transparent);
}

/* ---------- invite ---------- */
.enc-invite-actions {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    margin-top: var(--space-2);
}
.enc-invite-actions .modal-btn {
    width: 100%;
    border-radius: var(--radius-md);
}

/* ---------- session identity ---------- */
.enc-id {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-10);
}
.enc-id__name {
    font-size: var(--font-action);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.25;
}
.enc-id__sub {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    color: var(--text-muted);
}
.enc-id__sub b {
    color: var(--text-gold);
    font-weight: 600;
}

/* ---------- pending · 12px · 无左轨 ---------- */
.enc-pending {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    font-size: var(--font-body);
}
.enc-pending--mine {
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
    border-color: color-mix(in srgb, var(--accent-gold) 30%, var(--border-color));
}
.enc-pending--incoming {
    background: color-mix(in srgb, var(--accent-crimson) 9%, transparent);
    border-color: color-mix(in srgb, var(--accent-crimson) 36%, var(--border-color));
    box-shadow: none;
}
.enc-pending--death {
    background: color-mix(in srgb, var(--accent-crimson) 12%, transparent);
    border-color: color-mix(in srgb, var(--accent-crimson) 48%, var(--border-color));
}
.enc-pending__top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-8);
}
.enc-pending__title {
    font-size: var(--font-label);
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--text-gold);
    margin: 0;
}
.enc-pending--incoming .enc-pending__title {
    color: var(--text-danger, var(--accent-crimson));
}
.enc-pending__cd {
    font-size: var(--font-caption);
    font-variant-numeric: tabular-nums;
    color: var(--text-muted);
    margin: 0;
}
.enc-pending__desc {
    font-size: var(--font-label);
    line-height: 1.5;
    color: var(--text-secondary);
    word-break: break-all;
    margin: 0;
}
/* #6234：生死待决风险提示 */
.enc-pending__warn {
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-danger, var(--accent-crimson));
    margin: 0;
}
.enc-pending__btns {
    display: flex;
    gap: var(--space-8);
    margin-top: var(--space-2);
}
.enc-pending__btns .modal-btn {
    flex: 1;
    height: 34px;
    min-height: 34px;
    font-size: var(--font-label);
    border-radius: var(--radius-md);
}

/* ---------- chat · 12px 壳 / 8px 输入 ---------- */
.enc-chat {
    display: flex;
    flex-direction: column;
    min-height: 168px;
    max-height: 220px;
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-primary) 55%, var(--bg-card));
    overflow: hidden;
    flex: 1 1 auto;
    min-width: 0;
}
.enc-chat__log {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding: var(--space-10) var(--space-12);
    font-size: var(--font-label);
    line-height: 1.55;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-y;
    overflow-anchor: none;
    background: transparent;
    max-height: none;
}
.enc-line,
.enc-chat-line {
    margin-bottom: var(--space-8);
}
.enc-line--sys,
.enc-chat-line--system {
    color: var(--text-muted);
    font-size: var(--font-caption);
    font-style: italic;
}
.enc-line__who {
    font-weight: 700;
    margin-right: var(--space-4);
}
.enc-line__who--me {
    color: var(--text-gold);
}
.enc-line__who--other {
    color: var(--text-jade);
}
.enc-chat__input {
    display: flex;
    gap: var(--space-6);
    padding: var(--space-8);
    border-top: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    align-items: stretch;
    flex-shrink: 0;
}
.enc-chat__input .app-input {
    flex: 1;
    min-width: 0;
    height: 34px;
    padding: 0 var(--space-10);
    font-size: var(--font-label);
    border-radius: var(--radius-md);
    box-sizing: border-box;
}
/* 窄屏 ≥16px，避免 iOS/微信聚焦整页放大且失焦不回缩 */
@media (max-width: 640px) {
    .enc-chat__input .app-input {
        font-size: var(--font-title);
    }
}
.enc-chat__input .modal-btn {
    flex: 0 0 auto;
    width: 64px;
    height: 34px;
    min-height: 34px;
    padding: 0;
    font-size: var(--font-label);
    border-radius: var(--radius-md);
}

/* ---------- action grid · 10px 钮 ---------- */
.enc-acts {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
}
.enc-acts__group {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
}
.enc-acts__lab {
    font-size: var(--font-micro);
    font-weight: 600;
    letter-spacing: 0.12em;
    color: var(--text-muted);
    padding: 0 var(--space-2);
}
.enc-acts__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-6);
}
.enc-act {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: var(--space-6) var(--space-4);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: color-mix(in srgb, var(--bg-card) 80%, transparent);
    color: var(--text-secondary);
    font: inherit;
    font-size: var(--font-label);
    font-weight: 600;
    cursor: pointer;
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
    box-shadow: none;
    text-shadow: none;
    transition: border-color 0.12s ease, color 0.12s ease, background 0.12s ease, opacity 0.12s ease;
}
.enc-act:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 35%, var(--border-color));
    color: var(--text-primary);
}
.enc-act:active { opacity: 0.88; }
.enc-act--jade {
    color: var(--text-jade);
    border-color: color-mix(in srgb, var(--accent-jade) 32%, transparent);
    background: color-mix(in srgb, var(--accent-jade) 8%, transparent);
}
.enc-act--gold {
    color: var(--text-gold);
    border-color: color-mix(in srgb, var(--accent-gold) 32%, transparent);
    background: color-mix(in srgb, var(--accent-gold) 8%, transparent);
}
.enc-act--warn {
    color: var(--accent-orange, #9a6b3d);
    border-color: color-mix(in srgb, var(--accent-orange, #9a6b3d) 34%, transparent);
}
.enc-act--danger {
    color: var(--text-danger);
    border-color: color-mix(in srgb, var(--accent-crimson) 36%, transparent);
    background: color-mix(in srgb, var(--accent-crimson) 7%, transparent);
}
.enc-act--leave {
    grid-column: 1 / -1;
    color: var(--text-muted);
}
.enc-risk-action:disabled,
.enc-chat-focused .enc-risk-action {
    opacity: 0.45;
    cursor: not-allowed;
    filter: grayscale(0.3);
}

/* ---------- item cards · 12px / qty 8px ---------- */
.enc-sec-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    padding: 0 var(--space-2);
}
.enc-sec-head__t {
    font-size: var(--font-caption);
    font-weight: 700;
    letter-spacing: 0.12em;
    color: var(--text-jade, var(--accent-jade));
}
.enc-sec-head__n {
    font-size: var(--font-caption);
    color: var(--text-muted);
    font-variant-numeric: tabular-nums;
}
.enc-list,
.enc-trade-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-8);
    max-height: min(42vh, 280px);
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border: none;
    padding: 0;
    border-radius: 0;
    background: transparent;
}
.enc-item,
.enc-trade-row {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: var(--space-10);
    align-items: center;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    cursor: pointer;
    box-sizing: border-box;
    margin: 0;
    font-size: var(--font-label);
}
.enc-item:hover,
.enc-trade-row:hover {
    border-color: color-mix(in srgb, var(--accent-gold) 28%, var(--border-color));
}
.enc-item:has(input:checked),
.enc-trade-row:has(input:checked) {
    border-color: color-mix(in srgb, var(--accent-gold) 42%, var(--border-color));
    background: color-mix(in srgb, var(--accent-gold) 7%, var(--bg-panel, var(--bg-card)));
}
.enc-item input[type="checkbox"],
.enc-trade-row input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--accent-gold);
    flex: none;
}
.enc-item__main {
    min-width: 0;
}
.enc-item__name {
    font-size: var(--font-body);
    font-weight: 700;
    color: var(--text-primary);
    line-height: 1.3;
}
.enc-item__name em,
.enc-item__qty-label {
    font-style: normal;
    color: var(--text-gold);
    font-weight: 600;
    font-size: var(--font-caption);
    margin-left: var(--space-4);
}
.enc-item__desc {
    margin-top: var(--space-2);
    font-size: var(--font-caption);
    line-height: 1.45;
    color: var(--text-muted);
}
.enc-item__qty {
    width: 52px;
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-4) !important;
    text-align: center;
    font-size: var(--font-label);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-primary, var(--bg-card));
    color: var(--text-primary);
    box-sizing: border-box;
    -webkit-appearance: none;
    appearance: none;
}
.enc-item--action {
    grid-template-columns: 1fr auto;
    cursor: default;
}
.enc-item--action .modal-btn {
    height: 32px;
    min-height: 32px;
    max-height: 32px;
    padding: 0 var(--space-12);
    font-size: var(--font-label);
    width: auto;
    flex: none;
    border-radius: var(--radius-md);
}

.enc-price {
    display: flex;
    align-items: center;
    gap: var(--space-8);
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    margin-top: 0;
}
.enc-price__lab {
    font-size: var(--font-label);
    color: var(--text-muted);
    flex: none;
    white-space: nowrap;
}
.enc-price__input {
    flex: 1;
    width: auto;
    height: 34px;
    padding: 0 var(--space-10);
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
    background: var(--bg-primary, var(--bg-card));
    color: var(--text-gold);
    font-size: var(--font-body);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    box-sizing: border-box;
}
.enc-price__unit {
    font-size: var(--font-label);
    color: var(--text-muted);
    flex: none;
}
.enc-buy-desc {
    width: 100%;
    box-sizing: border-box;
    resize: vertical;
    min-height: 72px;
    padding: var(--space-10) var(--space-12);
    border-radius: var(--radius-lg);
    border: 1px solid var(--border-color);
    background: var(--bg-panel, var(--bg-card));
    color: var(--text-primary);
    font: inherit;
    font-size: var(--font-body);
    line-height: 1.5;
}
.enc-irrev {
    margin: 0;
    font-size: var(--font-caption);
    line-height: 1.5;
    color: var(--text-danger);
}
.enc-detail-list {
    margin: var(--space-6) 0 0;
    padding: 0 0 0 1.1em;
    font-size: var(--font-label);
    line-height: 1.55;
    color: var(--text-secondary);
}
.enc-detail-list li { margin: var(--space-2) 0; }
.enc-empty {
    padding: var(--space-16) var(--space-10);
    text-align: center;
    font-size: var(--font-label);
    color: var(--text-muted);
    line-height: 1.55;
    border-radius: var(--radius-lg);
    border: 1px dashed var(--border-color);
}

/* ---------- overlays：锁层 scrim 由 game-systems.css 统一；此处仅会话壳 ---------- */
.enc-session-overlay {
    overflow-anchor: none;
    align-items: flex-start;
}

@supports not (background: color-mix(in srgb, white 50%, black)) {
    .enc-card--soft,
    .enc-pending--mine,
    .enc-act--jade,
    .enc-act--gold {
        background: var(--bg-panel, var(--bg-card));
    }
    .enc-card--danger,
    .enc-pending--incoming,
    .enc-act--danger {
        background: var(--bg-panel, var(--bg-card));
    }
}

@media (max-width: 720px) {
    .enc-session-overlay {
        align-items: flex-start;
        padding-top: max(var(--space-8), env(safe-area-inset-top, 0px));
    }
    .enc-chat {
        min-height: 140px;
        max-height: 180px;
    }
}

@media (min-width: 760px) {
    /* 桌面：会话宽度由登记档（medium 520）提供，动作网格仍 3 列 */
    .enc-chat {
        max-height: 240px;
        min-height: 180px;
    }
}