/* 相生快速性格小测 overlay (assets/js/friends-mbti-quiz.js). */
html.mq-lock,html.mq-lock body{overflow:hidden}
.mq-overlay{position:fixed;inset:0;z-index:1000;display:flex;justify-content:center;overflow-y:auto;background:var(--xs-paper);color:var(--xs-ink);-webkit-overflow-scrolling:touch}
.mq-panel{box-sizing:border-box;width:100%;max-width:520px;min-width:0;padding:8px var(--xs-gutter) calc(24px + env(safe-area-inset-bottom));display:flex;flex-direction:column}
.mq-top{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:52px}
.mq-name{font-size:var(--xs-fs-sm);color:var(--xs-muted)}
.mq-icon{min-width:var(--xs-tap);min-height:var(--xs-tap);padding:0 8px;border:0;background:none;color:var(--xs-primary);font-size:var(--xs-fs-base);cursor:pointer}
.mq-close{font-size:26px;line-height:1;color:var(--xs-ink-2)}
.mq-progress{display:flex;align-items:center;gap:12px;margin:4px 0 24px}
.mq-count{flex:none;font-size:var(--xs-fs-sm);font-weight:600;color:var(--xs-ink-2);font-variant-numeric:tabular-nums}
.mq-bar{flex:1;height:6px;border-radius:var(--xs-r-pill);background:var(--xs-surface-2);overflow:hidden}
.mq-bar i{display:block;height:100%;background:var(--xs-primary);transition:width .25s var(--xs-ease)}
.mq-tie{margin:-12px 0 12px;font-size:var(--xs-fs-sm);color:var(--xs-muted)}
.mq-q{margin:0 0 24px;font-family:var(--xs-serif);font-size:var(--xs-fs-xl);line-height:1.45;font-weight:600;outline:none}
.mq-opts{display:grid;gap:12px}
.mq-opt{box-sizing:border-box;width:100%;min-height:64px;padding:14px 16px;border:1.5px solid var(--xs-line-strong);border-radius:var(--xs-r-lg);background:var(--xs-surface);color:var(--xs-ink);font:inherit;font-size:var(--xs-fs-md);line-height:1.5;text-align:left;cursor:pointer;overflow-wrap:anywhere}
@media (hover:hover){.mq-opt:hover{border-color:var(--xs-primary)}}
.mq-opt[aria-pressed="true"]{border-color:var(--xs-primary);background:var(--xs-primary-soft)}
.mq-opt:focus-visible,.mq-icon:focus-visible{outline:2px solid var(--xs-focus);outline-offset:2px}
.mq-foot{margin:20px 0 0;font-size:var(--xs-fs-sm);color:var(--xs-muted);text-align:center}
.mq-result{text-align:center}
.mq-kicker{margin:8px 0 4px;font-size:var(--xs-fs-sm);color:var(--xs-muted)}
.mq-type{margin:0;font-size:var(--xs-fs-display);line-height:1.1;letter-spacing:2px;color:var(--xs-primary);outline:none}
.mq-desc{margin:10px auto 20px;max-width:24em;font-size:var(--xs-fs-md);line-height:1.6;color:var(--xs-ink-2)}
.mq-axes{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:10px}
.mq-axes li{display:grid;grid-template-columns:3em minmax(0,1fr) 3em;align-items:center;gap:10px;font-size:var(--xs-fs-base);font-variant-numeric:tabular-nums}
.mq-ax{color:var(--xs-muted)}
.mq-ax:first-child{text-align:right}
.mq-ax:nth-child(3){text-align:left}
.mq-ax.is-win{color:var(--xs-ink);font-weight:700}
.mq-axbar{height:8px;border-radius:var(--xs-r-pill);background:var(--xs-line);overflow:hidden}
.mq-axbar i{display:block;height:100%;background:var(--xs-primary)}
.mq-actions{display:grid;gap:10px}
.mq-overlay .mq-actions button{display:flex;align-items:center;justify-content:center;width:100%;min-height:48px;margin:0;text-align:center}
.mq-disclaimer{margin:16px 0 0;font-size:var(--xs-fs-xs);line-height:1.6;color:var(--xs-muted)}
/* Entry points */
html body .onb-mbti-quiz{display:block;width:100%;min-height:var(--xs-tap);margin:10px 0 0;font-size:var(--xs-fs-base);font-weight:600}
html body .pe-page .pe-mbti-quiz-row{padding:0 0 8px calc(4.6em + 10px)}
html body .pe-page .pe-mbti-quiz-row button{min-height:var(--xs-tap);padding:0;font-size:var(--xs-fs-sm);color:var(--xs-primary)}
