/* 庚戌堂新手引导教程样式 */
.gxt-ob-overlay{position:fixed;inset:0;z-index:9998;pointer-events:none;background:rgba(10,22,40,0);transition:background .25s ease}
.gxt-ob-overlay.active{background:rgba(10,22,40,.55);pointer-events:auto}
.gxt-ob-highlight{position:fixed;z-index:9999;border-radius:8px;box-shadow:0 0 0 9999px rgba(10,22,40,.55),0 0 0 3px var(--vermilion,#8b1a1a),0 4px 24px rgba(0,0,0,.3);background:transparent;pointer-events:none;transition:all .3s cubic-bezier(.4,0,.2,1);opacity:0}
.gxt-ob-highlight.show{opacity:1}
.gxt-ob-bubble{position:fixed;z-index:10000;background:var(--paper-pure,#FBF8F1);border:1px solid var(--border,#E5E0D4);border-radius:14px;box-shadow:0 12px 40px rgba(10,22,40,.25);padding:18px 20px;max-width:340px;min-width:260px;font-family:var(--font-sans,system-ui);opacity:0;transform:translateY(8px);transition:all .3s cubic-bezier(.4,0,.2,1);pointer-events:none}
.gxt-ob-bubble.show{opacity:1;transform:translateY(0);pointer-events:auto}
.gxt-ob-bubble::before{content:"";position:absolute;width:14px;height:14px;background:var(--paper-pure,#FBF8F1);border-left:1px solid var(--border,#E5E0D4);border-top:1px solid var(--border,#E5E0D4);transform:rotate(45deg)}
.gxt-ob-bubble[data-pos="bottom"]::before{top:-7px;left:24px}
.gxt-ob-bubble[data-pos="top"]::before{bottom:-7px;left:24px;transform:rotate(225deg)}
.gxt-ob-bubble[data-pos="left"]::before{right:-7px;top:24px;transform:rotate(135deg)}
.gxt-ob-bubble[data-pos="right"]::before{left:-7px;top:24px;transform:rotate(-45deg)}
.gxt-ob-step{font-family:var(--font-mono,monospace);font-size:.72rem;color:var(--text3,#7A8A9A);letter-spacing:.12em;margin-bottom:6px}
.gxt-ob-title{font-family:var(--font-serif,"Noto Serif SC",serif);font-size:1.1rem;font-weight:700;color:var(--ink-deep,#0A1628);margin-bottom:8px;letter-spacing:.04em}
.gxt-ob-desc{font-size:.92rem;color:var(--text2,#3A4A5E);line-height:1.7;margin-bottom:16px}
.gxt-ob-desc strong{color:var(--vermilion,#8b1a1a);font-weight:600}
.gxt-ob-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.gxt-ob-btn{font-family:var(--font-sans,system-ui);font-size:.85rem;border:none;border-radius:8px;padding:8px 16px;cursor:pointer;font-weight:500;transition:all .2s;letter-spacing:.04em}
.gxt-ob-btn-primary{background:var(--ink-deep,#0A1628);color:#FBF8F1}
.gxt-ob-btn-primary:hover{background:var(--vermilion,#8b1a1a);transform:translateY(-1px)}
.gxt-ob-btn-ghost{background:transparent;color:var(--text3,#7A8A9A);border:1px solid var(--border,#E5E0D4)}
.gxt-ob-btn-ghost:hover{color:var(--ink-deep,#0A1628);border-color:var(--ink-mid,#3A4A5E)}
.gxt-ob-dots{display:flex;gap:6px;margin-left:auto;align-items:center}
.gxt-ob-dot{width:7px;height:7px;border-radius:50%;background:var(--border,#E5E0D4);transition:all .2s}
.gxt-ob-dot.active{background:var(--vermilion,#8b1a1a);width:18px;border-radius:4px}
.gxt-ob-skip{position:fixed;top:18px;right:24px;z-index:10003;font-family:var(--font-sans,system-ui);font-size:.82rem;color:#FBF8F1;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.2);padding:7px 14px;border-radius:20px;cursor:pointer;opacity:0;transition:opacity .25s;backdrop-filter:blur(4px)}
.gxt-ob-skip.show{opacity:1}
.gxt-ob-skip:hover{background:rgba(139,26,26,.7)}
.gxt-ob-welcome{position:fixed;inset:0;z-index:10002;display:none;align-items:center;justify-content:center;background:rgba(10,22,40,.7);backdrop-filter:blur(2px);padding:20px;pointer-events:none}
.gxt-ob-welcome.show{display:flex}
.gxt-ob-welcome-card{background:var(--paper-pure,#FBF8F1);border-radius:18px;padding:36px 32px 28px;max-width:440px;width:100%;text-align:center;box-shadow:0 20px 60px rgba(10,22,40,.4);animation:gxt-ob-pop .4s cubic-bezier(.34,1.56,.64,1);pointer-events:auto}

/* 减少动画偏好：关闭引导层玻璃态模糊以提升低端设备性能 */
@media (prefers-reduced-motion:reduce){
  .gxt-ob-skip,.gxt-ob-welcome{backdrop-filter:none}
}
@keyframes gxt-ob-pop{from{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}
.gxt-ob-welcome-icon{font-size:2.6rem;margin-bottom:10px}
.gxt-ob-welcome-title{font-family:var(--font-serif,"Noto Serif SC",serif);font-size:1.6rem;font-weight:900;color:var(--ink-deep,#0A1628);letter-spacing:.06em;margin-bottom:8px}
.gxt-ob-welcome-sub{font-size:.95rem;color:var(--text2,#3A4A5E);line-height:1.8;margin-bottom:20px}
.gxt-ob-welcome-features{display:grid;gap:10px;text-align:left;margin-bottom:24px}
.gxt-ob-welcome-feature{display:flex;gap:10px;align-items:flex-start;padding:10px 14px;background:rgba(201,184,150,.08);border-radius:10px;font-size:.86rem;color:var(--text2,#3A4A5E)}
.gxt-ob-welcome-feature-icon{font-size:1.1rem;flex-shrink:0}
.gxt-ob-welcome-actions{display:flex;gap:10px;justify-content:center}
@media (max-width:600px){
  .gxt-ob-bubble{max-width:88vw;min-width:220px;padding:14px 16px}
  .gxt-ob-title{font-size:1rem}
  .gxt-ob-desc{font-size:.86rem}
  .gxt-ob-welcome-card{padding:28px 22px 22px}
}

/* 暗色模式覆盖 */
[data-theme="dark"] .gxt-ob-overlay.active{background:rgba(0,0,0,.75)}
[data-theme="dark"] .gxt-ob-highlight{box-shadow:0 0 0 9999px rgba(0,0,0,.75),0 0 0 3px var(--vermilion,#C85A5A),0 4px 24px rgba(0,0,0,.5)}
[data-theme="dark"] .gxt-ob-bubble{background:var(--paper-warm,#1A1A1A);border-color:var(--border-strong,rgba(251,248,241,.22));color:var(--ink-deep,#FBF8F1)}
[data-theme="dark"] .gxt-ob-bubble::before{background:var(--paper-warm,#1A1A1A);border-color:var(--border-strong,rgba(251,248,241,.22))}
[data-theme="dark"] .gxt-ob-title{color:var(--ink-deep,#FBF8F1)}
[data-theme="dark"] .gxt-ob-desc{color:var(--text2,#B0A898)}
[data-theme="dark"] .gxt-ob-desc strong{color:var(--vermilion-light,#D46A6A)}
[data-theme="dark"] .gxt-ob-btn-ghost{color:var(--text2,#B0A898);border-color:var(--border-strong,rgba(251,248,241,.22))}
[data-theme="dark"] .gxt-ob-btn-ghost:hover{color:var(--ink-deep,#FBF8F1);border-color:var(--ink-mid,#C9B896)}
[data-theme="dark"] .gxt-ob-welcome{background:rgba(0,0,0,.85)}
[data-theme="dark"] .gxt-ob-welcome-card{background:var(--paper-warm,#1A1A1A);border-color:var(--border-strong,rgba(251,248,241,.22))}
[data-theme="dark"] .gxt-ob-welcome-title{color:var(--ink-deep,#FBF8F1)}
[data-theme="dark"] .gxt-ob-welcome-sub{color:var(--text2,#B0A898)}
[data-theme="dark"] .gxt-ob-welcome-feature{background:rgba(251,248,241,.08);color:var(--text2,#B0A898)}
