/* 知微阁 - 全局反馈动效（仅展示层，不触碰算法/排盘逻辑）
   主题化：全部颜色读取 style.css 的 --bg-rgb / --accent-rgb / --accent-light-rgb /
   --gold-dark-rgb / --color-text，随 data-theme 自动切换；动效只用 transform/opacity。 */
:root {
    --zwg-fx-ease: cubic-bezier(0.22, 0.61, 0.36, 1);
    --zwg-fx-frame: rgba(var(--accent-rgb, 201, 169, 97), 0.22);
    --zwg-fx-soft: rgba(var(--accent-rgb, 201, 169, 97), 0.10);
    --zwg-fx-x: 50%;
    --zwg-fx-y: 42%;
}

html.zwg-fx-lock,
html.zwg-fx-lock body {
    overflow: hidden;
}

/* ===== 全屏过渡 veil：从触点圆形晕开，再延迟显现印章内容 ===== */
.zwg-fx-veil {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: grid;
    place-items: center;
    padding: max(24px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(24px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    background:
        radial-gradient(circle at 50% 42%, rgba(var(--accent-rgb, 201, 169, 97), 0.14), transparent 32%),
        linear-gradient(145deg, rgba(var(--bg-rgb, 10, 10, 15), 0.972), rgba(var(--bg-rgb, 10, 10, 15), 0.918));
    color: var(--color-text, #E8E0D0);
    opacity: 0;
    visibility: hidden;
    transform: scale(1.012);
    clip-path: circle(0px at var(--zwg-fx-x) var(--zwg-fx-y));
    transition:
        clip-path 640ms var(--zwg-fx-ease),
        opacity 640ms var(--zwg-fx-ease),
        visibility 0s linear 640ms,
        transform 640ms var(--zwg-fx-ease);
    pointer-events: none;
    will-change: clip-path, opacity, transform;
}
.zwg-fx-veil.show {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    clip-path: circle(150vmax at var(--zwg-fx-x) var(--zwg-fx-y));
    transition:
        clip-path 640ms var(--zwg-fx-ease),
        opacity 420ms var(--zwg-fx-ease),
        visibility 0s,
        transform 640ms var(--zwg-fx-ease);
    pointer-events: auto;
}
.zwg-fx-veil::before {
    content: "";
    position: absolute;
    inset: 7% 8% auto 8%;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(var(--accent-rgb, 201, 169, 97), 0.58), transparent);
    opacity: 0.72;
    pointer-events: none;
}
.zwg-fx-veil::after {
    content: "";
    position: absolute;
    right: 10%;
    bottom: 11%;
    width: min(38vw, 260px);
    height: min(38vw, 260px);
    border: 1px solid rgba(var(--accent-rgb, 201, 169, 97), 0.10);
    transform: rotate(45deg);
    pointer-events: none;
}

.zwg-fx-core {
    position: relative;
    display: grid;
    justify-items: center;
    gap: 0.95rem;
    width: min(72vw, 360px);
    max-width: calc(100vw - 48px);
    padding: 1.15rem 1rem 1.25rem;
    text-align: center;
    opacity: 0;
    transform: translateY(12px) scale(0.985);
    transition: opacity 320ms var(--zwg-fx-ease) 150ms, transform 320ms var(--zwg-fx-ease) 150ms;
}
.zwg-fx-veil.show .zwg-fx-core {
    opacity: 1;
    transform: translateY(0) scale(1);
}
.zwg-fx-core::before,
.zwg-fx-core::after {
    content: "";
    position: absolute;
    left: 50%;
    width: min(46vw, 220px);
    height: 1px;
    transform: translateX(-50%);
    background: linear-gradient(90deg, transparent, var(--zwg-fx-frame), transparent);
    pointer-events: none;
}
.zwg-fx-core::before { top: 0; }
.zwg-fx-core::after { bottom: 0; }

.zwg-fx-mark {
    position: relative;
    width: 76px;
    height: 76px;
    color: rgba(var(--accent-light-rgb, 232, 199, 126), 0.96);
}
.zwg-fx-mark span {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    pointer-events: none;
}
.zwg-fx-mark .m1 {
    border: 1px dashed rgba(var(--accent-rgb, 201, 169, 97), 0.46);
    animation: zwgFxTurn 7.2s linear infinite;
}
.zwg-fx-mark .m2 {
    inset: 8px;
    border: 1px solid rgba(var(--accent-rgb, 201, 169, 97), 0.22);
}
.zwg-fx-mark .m3 {
    inset: -1px;
    background: conic-gradient(from 12deg, transparent 0 58%, rgba(var(--accent-rgb, 201, 169, 97), 0.96) 74%, rgba(var(--accent-light-rgb, 232, 199, 126), 0.98) 86%, transparent 100%);
    -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
            mask: radial-gradient(farthest-side, transparent calc(100% - 5px), #000 calc(100% - 4px));
    animation: zwgFxTurn 1.72s cubic-bezier(0.62, 0.05, 0.32, 0.95) infinite;
}
.zwg-fx-mark .m4 {
    inset: 27px;
    border-radius: 3px;
    background: linear-gradient(135deg, rgba(var(--accent-light-rgb, 232, 199, 126), 0.96), rgba(var(--accent-rgb, 201, 169, 97), 0.52));
    box-shadow:
        0 0 0 1px rgba(var(--accent-rgb, 201, 169, 97), 0.28) inset,
        0 0 26px rgba(var(--accent-rgb, 201, 169, 97), 0.24);
    transform: rotate(45deg) scale(0.92);
    animation: zwgFxSeal 1.72s var(--zwg-fx-ease) infinite;
}

.zwg-fx-label {
    max-width: 100%;
    color: rgba(var(--accent-light-rgb, 232, 199, 126), 0.98);
    font-size: clamp(0.84rem, 2.5vw, 0.98rem);
    font-weight: 700;
    letter-spacing: 0.28em;
    text-indent: 0.28em;
    line-height: 1.45;
    white-space: nowrap;
    text-shadow: 0 0 16px rgba(var(--accent-rgb, 201, 169, 97), 0.20);
}
html[lang="en"] .zwg-fx-label {
    letter-spacing: 0.12em;
    text-indent: 0.12em;
    font-weight: 650;
}

/* 省略号：固定宽度 + 仅透明度起伏，避免手机端基线跳动/横向挤压 */
.zwg-fx-dots,
.zwg-dots {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    width: 1.08em;
    min-width: 1.08em;
    margin-left: 0.08em;
    line-height: 1;
    vertical-align: baseline;
}
.zwg-fx-dots { justify-content: center; color: rgba(var(--accent-rgb, 201, 169, 97), 0.92); }
.zwg-fx-dots i,
.zwg-dots i {
    display: inline-block;
    width: 0.24em;
    font-style: normal;
    line-height: 1;
    text-align: center;
    opacity: 0.16;
    animation: zwgFxDot 1.02s ease-in-out infinite;
}
.zwg-fx-dots i:nth-child(2),
.zwg-dots i:nth-child(2) { animation-delay: 0.15s; }
.zwg-fx-dots i:nth-child(3),
.zwg-dots i:nth-child(3) { animation-delay: 0.30s; }

/* ===== 行内小反馈：语言切换 FAB / 重新检测链接 ===== */
.zwg-mini-spin,
.zwg-btn-spin {
    flex: 0 0 auto;
    display: inline-block;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    border: 1.5px solid currentColor;
    border-right-color: transparent;
    animation: zwgFxTurn 820ms linear infinite;
}
.zwg-link-loading {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 0.38em;
    white-space: nowrap;
    pointer-events: none !important;
    cursor: wait !important;
}
.zwg-link-loading .zwg-mini-spin { margin: 0; }

/* ===== 提交按钮 loading：锁住原宽度与中心，不挤压、不换行、不抖 ===== */
.gate-btn.zwg-btn-loading,
.ig-btn.zwg-btn-loading {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0;
    text-indent: 0;
    letter-spacing: 0.08em;
    pointer-events: none !important;
    cursor: wait !important;
}
.zwg-btn-inner {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.46em;
    max-width: 100%;
    min-width: 0;
    white-space: nowrap;
    line-height: 1;
}
.gate-btn.zwg-btn-loading .zwg-btn-text,
.ig-btn.zwg-btn-loading .zwg-btn-text {
    display: inline-block;
    max-width: calc(100% - 2.2em);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: inherit;
    text-indent: 0;
}
.gate-btn.zwg-btn-loading .zwg-btn-spin,
.ig-btn.zwg-btn-loading .zwg-btn-spin {
    margin: 0;
    vertical-align: 0;
}

/* 明色主题：压暗辉光，保持纸面/水墨质感 */
html[data-theme="taiji"] .zwg-fx-veil,
html[data-theme="zhusha"] .zwg-fx-veil {
    background:
        radial-gradient(circle at 50% 42%, rgba(var(--accent-rgb), 0.10), transparent 34%),
        linear-gradient(145deg, rgba(var(--bg-rgb), 0.965), rgba(var(--bg-rgb), 0.925));
}
html[data-theme="taiji"] .zwg-fx-label,
html[data-theme="zhusha"] .zwg-fx-label {
    color: var(--color-gold);
    text-shadow: none;
}
html[data-theme="taiji"] .zwg-fx-mark .m4,
html[data-theme="zhusha"] .zwg-fx-mark .m4 {
    box-shadow: 0 0 0 1px rgba(var(--accent-rgb), 0.30) inset;
}

/* 移动端：缩小印章、放宽字距，登录中/注册中不再挤乱 */
@media (max-width: 480px) {
    .zwg-fx-core {
        width: min(78vw, 320px);
        gap: 0.82rem;
        padding: 1rem 0.85rem 1.1rem;
    }
    .zwg-fx-mark { width: 62px; height: 62px; }
    .zwg-fx-mark .m4 { inset: 22px; }
    .zwg-fx-label { letter-spacing: 0.18em; text-indent: 0.18em; }
    html[lang="en"] .zwg-fx-label { letter-spacing: 0.08em; text-indent: 0.08em; }
    .gate-btn.zwg-btn-loading,
    .ig-btn.zwg-btn-loading {
        min-height: 48px;
        padding-left: 0.55rem;
        padding-right: 0.55rem;
        letter-spacing: 0.035em;
        font-size: 0.92rem;
    }
    .zwg-btn-inner { gap: 0.38em; }
    .zwg-dots { width: 0.98em; min-width: 0.98em; }
}

@keyframes zwgFxTurn {
    to { transform: rotate(360deg); }
}
@keyframes zwgFxSeal {
    0%, 100% { transform: rotate(45deg) scale(0.88); opacity: 0.72; }
    42% { transform: rotate(45deg) scale(1); opacity: 1; }
    68% { transform: rotate(45deg) scale(0.96); opacity: 0.9; }
}
@keyframes zwgFxDot {
    0%, 100% { opacity: 0.16; }
    36% { opacity: 1; }
    70% { opacity: 0.42; }
}

@supports not (clip-path: circle(1px at 50% 50%)) {
    .zwg-fx-veil,
    .zwg-fx-veil.show { clip-path: none; }
}

@media (prefers-reduced-motion: reduce) {
    .zwg-fx-veil,
    .zwg-fx-veil.show {
        clip-path: none !important;
        transform: none !important;
        transition-duration: 1ms !important;
        transition-delay: 0s !important;
    }
    .zwg-fx-core {
        opacity: 1;
        transform: none;
        transition-duration: 1ms;
        transition-delay: 0s;
    }
    .zwg-fx-mark .m1,
    .zwg-fx-mark .m3,
    .zwg-fx-mark .m4,
    .zwg-fx-dots i,
    .zwg-dots i,
    .zwg-mini-spin,
    .zwg-btn-spin {
        animation-duration: 1ms !important;
        animation-iteration-count: 1 !important;
    }
    .zwg-fx-dots i,
    .zwg-dots i { opacity: 1; }
}


/* ============================================================
   轻提示 Toast（替代原生 alert）——zwToast()
   顶部居中浮层：暗底描金细边、衬线字、图标分型（成功/错误/提醒）
   明色主题（太极/朱砂等）自动压深文字与边框；支持 stacked 多条、点击即关
   ============================================================ */
.zwg-toast-wrap {
    position: fixed;
    top: calc(16px + env(safe-area-inset-top, 0px));
    left: 50%;
    transform: translateX(-50%);
    z-index: 100000;
    width: min(92vw, 440px);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    pointer-events: none;
}
.zwg-toast {
    pointer-events: auto;
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 0.62rem;
    padding: 0.78rem 2.1rem 0.78rem 0.95rem;
    border-radius: 10px;
    background: linear-gradient(160deg, rgba(30, 30, 42, 0.94), rgba(14, 14, 20, 0.96));
    border: 1px solid rgba(201, 169, 97, 0.38);
    box-shadow: 0 12px 36px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(232, 199, 126, 0.1);
    color: #E8E0D0;
    font-family: 'Noto Serif SC', 'Cinzel', serif;
    font-size: 0.86rem;
    line-height: 1.7;
    letter-spacing: 0.02em;
    opacity: 0;
    transform: translateY(-12px) scale(0.97);
    transition: opacity 0.26s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);
    cursor: pointer;
    overflow: hidden;
}
.zwg-toast::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(201, 169, 97, 0.85), rgba(232, 199, 126, 0.85), rgba(201, 169, 97, 0.85), transparent);
    opacity: 0.5;
}
.zwg-toast.show { opacity: 1; transform: translateY(0) scale(1); }
.zwg-toast.hide { opacity: 0; transform: translateY(-10px) scale(0.97); }
.zwg-toast .zwg-toast-ico { flex-shrink: 0; font-size: 1.02rem; line-height: 1.7; }
.zwg-toast .zwg-toast-msg { flex: 1; min-width: 0; word-break: break-word; }
.zwg-toast .zwg-toast-x {
    position: absolute; top: 0.42rem; right: 0.55rem;
    font-size: 0.72rem; opacity: 0.45; transition: opacity 0.2s ease;
}
.zwg-toast:hover .zwg-toast-x { opacity: 0.9; }
/* 分型：成功=鎏金 / 错误=绛红 / 提醒=暖珀 */
.zwg-toast.t-success .zwg-toast-ico { color: #E8C77E; }
.zwg-toast.t-error { border-color: rgba(176, 69, 69, 0.55); }
.zwg-toast.t-error::before { background: linear-gradient(90deg, transparent, rgba(176, 69, 69, 0.8), rgba(210, 100, 100, 0.8), rgba(176, 69, 69, 0.8), transparent); }
.zwg-toast.t-error .zwg-toast-ico { color: #D06A6A; }
.zwg-toast.t-warning { border-color: rgba(200, 150, 70, 0.55); }
.zwg-toast.t-warning::before { background: linear-gradient(90deg, transparent, rgba(200, 150, 70, 0.8), rgba(232, 190, 110, 0.8), rgba(200, 150, 70, 0.8), transparent); }
.zwg-toast.t-warning .zwg-toast-ico { color: #E0B96E; }
/* 明色主题（太极水墨 / 朱砂宣纸等）：浮层保持深色面板，属覆盖层无需反色，
   仅微调投影避免在浅底上发闷 */
html[data-theme="taiji"] .zwg-toast,
html[data-theme="zhusha"] .zwg-toast {
    box-shadow: 0 12px 30px rgba(30, 25, 15, 0.35), inset 0 1px 0 rgba(232, 199, 126, 0.12);
}
@media (prefers-reduced-motion: reduce) {
    .zwg-toast { transition-duration: 1ms; }
}