/* Mask quest article: figures, FAQ disclosures and the checklist, in the zone's navy and gold. */
.prose figure img { display: block; width: 100%; height: auto; border-radius: 12px; border: 2px solid var(--oot-rim-dim); background: var(--oot-night); }
.prose figcaption { margin-top: 8px; color: var(--oot-ink-dim); font-size: .92rem; line-height: 1.5; }
.prose details { margin: 10px 0; padding: 0 16px; border: 1px solid var(--oot-rim-dim); border-radius: 12px; background: linear-gradient(180deg, var(--oot-panel-top), var(--oot-panel-bot)); }
.prose details[open] { padding-bottom: 4px; }
.prose summary { cursor: pointer; padding: 12px 0; font-weight: 700; color: var(--oot-gold-soft); }
.prose summary:focus-visible { outline: 2px solid var(--oot-gold); outline-offset: 2px; }
.prose details p { margin: 0 0 12px; }
.prose .oot-mq { display: block; margin: 14px 0 20px; padding: 16px 18px; border: 2px solid var(--oot-rim-dim); border-radius: 14px; background: linear-gradient(180deg, var(--oot-panel-top), var(--oot-panel-bot)); }
.prose .oot-mq-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.prose .oot-mq-list li { margin: 0; padding: 0; }
.oot-mq-list label { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border-radius: 10px; cursor: pointer; color: var(--oot-ink); }
.oot-mq-list label:hover { background: rgba(243, 207, 95, .08); }
.oot-mq-list input { flex: none; width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--oot-gold); }
.oot-mq-list li.is-done span { color: var(--oot-ink-dim); text-decoration: line-through; text-decoration-color: var(--oot-gold-deep); }
.prose .oot-mq-foot { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--oot-line); }
.prose .oot-mq-foot p { margin: 0; }
.oot-mq-count { font-weight: 800; color: var(--oot-gold); }
.oot-mq-wallet { display: flex; align-items: center; gap: 8px; color: var(--oot-ink-dim); }
.oot-mq-wallet select { padding: 6px 10px; border-radius: 8px; border: 1px solid var(--oot-rim-dim); background: var(--oot-night); color: var(--oot-ink); font: inherit; }
.oot-mq-left { flex: 1 1 260px; color: var(--oot-ink); }
.oot-mq-reset { padding: 6px 14px; border-radius: 8px; border: 1px solid var(--oot-gold-deep); background: transparent; color: var(--oot-gold-soft); font: inherit; cursor: pointer; }
.oot-mq-reset:hover { background: rgba(243, 207, 95, .12); }
