/* PHQ-9：进度条 + 九行频率选择，强调「题目优先、分数后置」 */

.pq-copy { min-width: 0; }
.pq-hl { color: var(--dk-accent); }

.pq-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 24px; }
.pq-jump a {
    padding: 6px 12px; font-size: 12.5px; color: var(--dk-ink-2); text-decoration: none;
    border: 1px solid var(--dk-line); border-radius: 99px; background: var(--dk-surface);
    transition: color .14s, border-color .14s, background .14s;
}
.pq-jump a:hover { color: var(--dk-accent); border-color: var(--dk-accent-line); background: var(--dk-accent-soft); }

#pqLevel, #pqItem9, #pqUse, #pqFaq { scroll-margin-top: 84px; }

.pq-tool { position: sticky; top: 82px; }

.pq-progress { height: 4px; background: var(--dk-surface-3); border-radius: 99px; overflow: hidden; }
.pq-progress i {
    display: block; height: 100%; width: 0;
    background: linear-gradient(90deg, #a78bfa, var(--dk-accent));
    transition: width .28s ease;
}

.pq-items { display: flex; flex-direction: column; }

.pq-item {
    padding: 13px 18px 14px;
    border-top: 1px solid var(--dk-line);
    transition: background .16s;
}
.pq-item:first-child { border-top: 0; }
.pq-item:has(.pq-opt[aria-checked="true"]) { background: color-mix(in srgb, var(--dk-accent-soft) 45%, transparent); }

.pq-q { display: flex; align-items: flex-start; gap: 9px; }
.pq-no {
    font-family: var(--cl-serif); font-size: 12px; color: var(--dk-muted);
    padding-top: 3px; letter-spacing: .04em; font-variant-numeric: tabular-nums;
}
.pq-q p { margin: 0; font-size: 13.5px; line-height: 1.6; color: var(--dk-ink); }

.pq-opts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 6px; margin-top: 9px; }
.pq-opt {
    padding: 7px 4px; border-radius: 8px; cursor: pointer;
    border: 1px solid var(--dk-line); background: var(--dk-surface);
    color: var(--dk-ink-2); font-size: 12px; line-height: 1.3;
    transition: border-color .14s, background .14s, color .14s;
}
.pq-opt:hover { border-color: var(--dk-accent-line); color: var(--dk-accent); }
.pq-opt[aria-checked="true"] {
    border-color: var(--dk-accent); background: var(--dk-accent-soft);
    color: var(--dk-accent); font-weight: 700;
}
.pq-opt:focus-visible { outline: 2px solid var(--dk-accent); outline-offset: 2px; }

/* 第 9 题：安全相关，单独强调 */
.pq-item--risk { border-left: 3px solid transparent; }
.pq-item--risk:has(.pq-opt[aria-checked="true"]:not([data-v="0"])) {
    border-left-color: var(--dk-err);
    background: color-mix(in srgb, var(--dk-err-soft) 60%, transparent);
}
.pq-item--risk .pq-q p { font-weight: 600; }

.pq-alert {
    margin: 0; padding: 12px 18px;
    font-size: 12.8px; line-height: 1.7;
    color: var(--dk-err); background: var(--dk-err-soft);
    border-top: 1px solid color-mix(in srgb, var(--dk-err) 28%, transparent);
}
.pq-alert b { font-weight: 700; }

.pq-result {
    display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: center;
    padding: 15px 18px;
    border-top: 1px solid var(--dk-line);
    background: linear-gradient(180deg, var(--dk-surface-2), var(--dk-surface));
}
.pq-score { display: flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.pq-score b {
    font-family: var(--cl-serif); font-size: 40px; line-height: 1;
    color: var(--dk-accent); letter-spacing: -.02em; font-variant-numeric: tabular-nums;
}
.pq-score span { font-size: 11.5px; color: var(--dk-muted); }
.pq-vt { margin: 0 0 2px; font-size: 13.5px; font-weight: 700; color: var(--dk-ink); }
.pq-vd { margin: 0; font-size: 12.5px; line-height: 1.65; color: var(--dk-ink-2); }

.pq-zones { grid-column: 1 / -1; display: flex; gap: 3px; }
.pq-zones i { flex: 1; height: 6px; border-radius: 99px; background: var(--dk-surface-3); transition: background .18s; }
.pq-zones i.on.z1 { background: #22c55e; }
.pq-zones i.on.z2 { background: #84cc16; }
.pq-zones i.on.z3 { background: #f59e0b; }
.pq-zones i.on.z4 { background: #f97316; }
.pq-zones i.on.z5 { background: #dc2626; }

.pq-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 0 18px 16px; }
.pq-presets { display: inline-flex; flex-wrap: wrap; gap: 6px; margin-left: auto; }
.pq-preset {
    border: 1px dashed var(--dk-line-strong); background: transparent;
    color: var(--dk-muted); font-size: 11.5px; padding: 4px 9px; border-radius: 99px; cursor: pointer;
    transition: color .14s, border-color .14s;
}
.pq-preset:hover { color: var(--dk-accent); border-color: var(--dk-accent-line); }

.pq-rel { display: block; }
.pq-rel h3 { font-size: 15.5px; margin-bottom: 6px; }
.pq-rel p { margin: 0; font-size: 13px; color: var(--dk-muted); line-height: 1.65; }

:root[data-theme="dark"] .pq-score b,
:root[data-theme="dark"] .pq-opt[aria-checked="true"],
:root[data-theme="dark"] .pq-jump a:hover,
:root[data-theme="dark"] .pq-preset:hover { color: #c4b5fd; }

@media (max-width: 960px) { .pq-tool { position: static; } }

@media (max-width: 560px) {
    .pq-item { padding: 12px 14px 13px; }
    .pq-opts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .pq-score b { font-size: 32px; }
    .pq-presets { margin-left: 0; }
}

/* 窄屏下标题与进度计数不互相挤压 */
.pq-tool .dk-tool-head h2 { min-width: 0; }
.pq-tool .dk-tool-head > span { flex: none; white-space: nowrap; }
