.qw-help-shade {
    position: fixed;
    inset: 0;
    z-index: 20000;
    background: transparent; /* spotlight 效果由 .qw-help-focus 的 box-shadow 承担 */
}
.qw-help-focus {
    position: fixed;
    z-index: 20001;
    border-radius: 10px;
    /* 超大 box-shadow 在目标元素四周制造暗色遮罩，形成打洞聚焦效果 */
    box-shadow:
        0 0 0 9999px rgba(21, 28, 24, .65),  /* 全屏暗罩 */
        0 0 0 3px #ffffff,                    /* 白色内框 */
        0 0 0 6px rgba(139, 154, 132, .85),  /* 绿色光晕 */
        0 8px 32px rgba(0, 0, 0, .35);       /* 投影 */
    pointer-events: none;
    transition: top .28s cubic-bezier(.4,0,.2,1),
                left .28s cubic-bezier(.4,0,.2,1),
                width .28s cubic-bezier(.4,0,.2,1),
                height .28s cubic-bezier(.4,0,.2,1);
}
.qw-help-card {
    position: fixed;
    z-index: 20002;
    width: min(370px, calc(100vw - 32px));
    padding: 20px;
    color: #26312b;
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 18px 55px rgba(0, 0, 0, .25);
    font-family: var(--font-chinese, 'LXGW WenKai', '霞鹜文楷', '霞骛文楷', serif);
    letter-spacing: 0;
}
.qw-help-progress { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #68736d; font-size: 13px; }
.qw-help-title-row { display: flex; align-items: flex-start; gap: 12px; margin: 12px 0 8px; }
.qw-help-card h2 { flex: 1; margin: 0; font-size: 20px; line-height: 1.35; }
.qw-help-speak {
    width: 36px;
    height: 36px;
    flex: 0 0 36px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #cfd8d2;
    border-radius: 50%;
    background: #fff;
    color: #667b61;
    cursor: pointer;
}
.qw-help-speak:hover, .qw-help-speak.speaking { color: #fff; background: #8b9a84; border-color: #8b9a84; }
.qw-help-speak .material-icons { font-size: 19px; }
.qw-help-card p { margin: 0; color: #5f6964; font-size: 14px; line-height: 1.7; }
.qw-help-actions { display: flex; justify-content: space-between; gap: 8px; margin-top: 20px; }
.qw-help-actions div { display: flex; gap: 8px; }
.qw-help-actions button {
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid #cfd8d2;
    border-radius: 6px;
    background: #fff;
    color: #435049;
    font: inherit;
    cursor: pointer;
}
.qw-help-actions button.primary { color: #fff; background: #8b9a84; border-color: #8b9a84; }
.qw-help-actions button:focus-visible { outline: 3px solid rgba(139, 154, 132, .28); outline-offset: 2px; }
.qw-help-dots { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; max-width: 160px; }
.qw-help-dot { width: 6px; height: 6px; flex: 0 0 6px; border-radius: 50%; background: #d7ddd9; }
.qw-help-dot.active { background: #8b9a84; }
body.qw-help-open { overflow: hidden; }
@media (max-width: 640px) {
    .qw-help-card { left: 16px !important; right: 16px; bottom: 16px !important; top: auto !important; width: auto; }
}