/* Quiz + video pop-ups — themed by each page's --q-* variables */
.q-dlg,.v-dlg{border:0;padding:0;color:var(--q-text)}
.q-dlg::backdrop,.v-dlg::backdrop{background:rgba(0,0,0,.6);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.q-dlg{margin:0;width:100%;max-width:100%;height:100%;max-height:100%;background:var(--q-bg);overscroll-behavior:contain}
.q-dlg[open]{animation:qdlg .35s cubic-bezier(.2,.7,.2,1)}
@keyframes qdlg{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
@media (min-width:640px){.q-dlg{margin:auto;width:580px;height:auto;max-height:calc(100% - 48px);border-radius:calc(var(--q-r) + 10px);box-shadow:0 40px 100px -20px rgba(0,0,0,.45)}}
.q-in{display:flex;flex-direction:column;min-height:100%;padding:18px 20px calc(26px + env(safe-area-inset-bottom))}
@media (min-width:640px){.q-in{padding:26px 32px 30px}}
.q-top{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:13px;font-weight:700;color:var(--q-muted)}
.q-top b{color:var(--q-text)}
.q-x{width:44px;height:44px;border-radius:999px;border:1px solid var(--q-line);background:var(--q-surface);color:var(--q-text);display:grid;place-items:center;cursor:pointer}
.q-segs{margin-top:18px;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.q-segs i{height:4px;border-radius:99px;background:var(--q-line);position:relative;overflow:hidden}
.q-segs i::after{content:"";position:absolute;inset:0;background:var(--q-acc);transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.q-segs i.done::after{transform:none}
.q-meta{margin-top:12px;font-size:13px;color:var(--q-muted)}
.q-step{display:none;margin-top:22px}
.q-step.on{display:block;animation:qin .35s cubic-bezier(.2,.7,.2,1)}
@keyframes qin{from{opacity:0;transform:translateX(16px)}to{opacity:1;transform:none}}
.q-step h3{margin:0 0 8px;font-size:clamp(26px,6vw,32px);font-weight:800;letter-spacing:-.035em;line-height:1.08;outline:none}
.q-hint{color:var(--q-muted);font-size:15px;margin:0 0 20px}
.q-opts{display:grid;gap:10px}
.q-opt{display:flex;align-items:center;gap:14px;min-height:60px;padding:8px 16px 8px 8px;border-radius:var(--q-r);border:1.5px solid var(--q-line);background:var(--q-surface);color:var(--q-text);font:inherit;font-size:16px;font-weight:600;text-align:left;cursor:pointer;transition:border-color .15s,transform .15s}
.q-opt:hover{border-color:var(--q-text);transform:translateX(3px)}
.q-k{width:42px;height:42px;border-radius:calc(var(--q-r) - 4px);background:var(--q-bg);display:grid;place-items:center;font-size:14px;font-weight:700;flex-shrink:0;color:var(--q-muted)}
.q-l small{display:block;font-size:13px;font-weight:500;color:var(--q-muted)}
.q-opt[aria-pressed="true"]{border-color:var(--q-acc)}
.q-opt[aria-pressed="true"] .q-k{background:var(--q-acc);color:var(--q-acc-ink)}
.q-field{display:grid;gap:6px;margin-bottom:12px}
.q-field label{font-size:13px;font-weight:700}
.q-field input{height:56px;padding:0 16px;border-radius:var(--q-r);border:1.5px solid var(--q-line);background:var(--q-surface);color:var(--q-text);font:inherit;font-size:16px}
.q-field input:focus{border-color:var(--q-acc);outline:none}
.q-field input[aria-invalid="true"]{border-color:#E5484D}
.q-err{color:#E5484D;font-size:13px;min-height:18px}
.q-pair{display:grid;gap:0 12px}
@media (min-width:520px){.q-pair{grid-template-columns:1fr 1fr}}
.q-consent{font-size:12px;color:var(--q-muted);margin:2px 0 16px}
.q-submit{width:100%;min-height:58px;display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:999px;background:var(--q-acc);color:var(--q-acc-ink);font:inherit;font-size:16px;font-weight:800;cursor:pointer}
.q-back{border:0;background:none;padding:10px 0;min-height:44px;color:var(--q-muted);font:inherit;font-weight:700;font-size:14px;cursor:pointer}
.q-foot{margin-top:auto;padding-top:14px}
.q-done{width:56px;height:56px;border-radius:999px;background:var(--q-acc);color:var(--q-acc-ink);display:grid;place-items:center;margin-bottom:16px}
#cal-inline{margin-top:16px;width:100%;min-height:540px;border-radius:var(--q-r);overflow:auto;background:var(--q-surface);border:1px solid var(--q-line)}
.q-fallback{font-size:13px;color:var(--q-muted);margin-top:10px}
.q-fallback a{color:var(--q-text)}
.v-dlg{width:min(92vw,960px);max-width:none;background:#000;border-radius:16px;overflow:hidden}
.v-frame{aspect-ratio:16/9;position:relative}
.v-frame iframe,.v-frame video{position:absolute;inset:0;width:100%;height:100%;border:0}
.v-x{position:absolute;top:10px;right:10px;z-index:2}
.media-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:20px;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.5}
[data-media] img,[data-media] video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){.q-dlg[open],.q-step.on{animation:none}}
