/* Quests (/quests/think-clearly/): page-only styles. Colours come from the tokens in site.css, so dark mode follows. */
.qx { border-bottom: 1px solid var(--line); }
.qx h2 { margin-top: .3rem; }
.qx-map { padding-left: 1.4rem; }
.qx-map li { margin-bottom: .35rem; }
.qx-done, .qx-est { font: 600 .8rem/1.2 var(--sans); letter-spacing: .04em; color: var(--ink-3); margin-left: .4rem; white-space: nowrap; }
.qx-done { color: var(--ok); }
.qx-step { margin: 2rem 0 .6rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .4rem; }
.qx-case, .qx-model, .qx-result { margin: 1rem 0; }
.qx-case blockquote { margin: .8rem 0; padding: .2rem 0 .2rem 1rem; border-left: 3px solid var(--accent); font-family: var(--serif); font-size: 1.08rem; }
.qx-form { display: grid; gap: 1rem; margin: .5rem 0 1rem; }
.qx-form textarea[readonly] { background: var(--surface-2); }
.qx-note { color: var(--ink-2); border-left: 3px solid var(--line-strong); padding-left: .8rem; font-size: .95rem; }
.qx-tests, .qx-ticks { border: 1px solid var(--line); border-radius: var(--r-sm); padding: .8rem 1rem; margin: 0; display: grid; gap: .55rem; min-width: 0; }
.qx-ticks { margin: 1rem 0; }
.qx-tests legend, .qx-ticks legend { font-weight: 650; padding: 0 .3rem; }
.qx-tests label, .qx-ticks label { display: flex; gap: .6rem; align-items: flex-start; font-weight: 500; }
.qx-tests input, .qx-ticks input { margin-top: .25rem; flex: none; width: 1.15rem; height: 1.15rem; accent-color: var(--accent); }
.qx-ticks p { margin: 0; }
.qx-table { overflow-x: auto; }
.qx-table table { width: 100%; border-collapse: collapse; font-size: .95rem; }
.qx-table th, .qx-table td { text-align: left; vertical-align: top; padding: .45rem .5rem; border-bottom: 1px solid var(--line); }
.qx-stop { margin-top: 1.5rem; }
.qx-status:empty { display: none; }
.qx-outputs dt { font-weight: 650; margin-top: .8rem; }
.qx-outputs dd { margin: .2rem 0 0; white-space: pre-wrap; }
.qx-transfer { margin-top: 2.5rem; padding-top: 1.5rem; border-top: 2px solid var(--line-strong); }
[data-after]:focus { outline: none; }
