/*
 * Dossier pages: manifesto, explorer quiz, privacy and generic pages.
 * Same d- prefix and tokens as redesign.css (declared on .d-sec); loaded sitewide after it.
 */

/* ---------- shared ---------- */
.d-sec h1 { font-family: var(--display); font-weight: 900; text-transform: uppercase; line-height: .92; letter-spacing: .005em; text-wrap: balance; overflow-wrap: normal; max-width: none; font-size: clamp(2.5rem, 8.4vw, 6rem); }
.d-sec h1 em { font-style: normal; }
.d-sec .d-act { display: inline-flex; align-items: center; gap: 12px; min-height: 56px; padding: 0 26px; background: var(--night); color: var(--gold); font: 900 1.375rem/1 var(--display); letter-spacing: .08em; text-transform: uppercase; text-decoration: none; border-radius: 6px; transition: transform .4s var(--ease), background-color .3s var(--ease); }
.d-sec .d-act svg { width: 1.1em; height: 1.1em; flex: none; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--ease); }
.d-sec .d-act:hover { background: var(--violet-deep); }
.d-sec .d-act:hover svg { transform: translateX(6px); }
body:not(.home) .d-foot { --prev: #f6f4ff; }
body:has(.d-case) .d-foot { --prev: #6c4dff; }

/* ---------- manifesto ---------- */
.d-mhero { padding: clamp(56px, 7vw, 96px) 0 clamp(88px, 10vw, 140px); overflow: hidden; }
.d-mhero h1 em { color: var(--gold); }
.d-mhero .d-bigbody { max-width: 24ch; margin-top: clamp(28px, 4vw, 52px); font-size: clamp(1.5rem, 2.6vw, 2.25rem); font-weight: 700; line-height: 1.25; color: #fff; }
.d-mhero-char { position: absolute; z-index: 0; right: -2%; bottom: -40px; width: clamp(200px, 30vw, 440px); height: auto; rotate: 6deg; pointer-events: none; }
.d-mhero h1, .d-mhero .d-bigbody, .d-mhero .d-clue { position: relative; z-index: 1; }

.d-mintro, .d-mprin, .d-mno, .d-mclose, .d-msrc { position: relative; }
.d-mintro::before, .d-mprin::before, .d-mno::before, .d-mclose::before, .d-msrc::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 12px; z-index: 3; pointer-events: none; background: radial-gradient(circle at 50% 0, var(--prev) 6.5px, transparent 7px) 0 0 / 24px 12px repeat-x; }
.d-mintro { --prev: var(--night); }
.d-mprin { --prev: var(--paper); }
.d-mno { --prev: var(--violet); }
.d-mclose { --prev: var(--night); }
.d-msrc { --prev: var(--gold); }

.d-mintro-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(28px, 6vw, 96px); align-items: start; }
.d-mlead { max-width: 20ch; font: 700 clamp(1.75rem, 3.6vw, 3.25rem)/1.12 var(--text); letter-spacing: -.01em; color: var(--ink); }
.d-mlead-2 { padding-top: .5em; color: var(--violet-deep); }
.d-mband { margin-top: clamp(40px, 6vw, 80px); min-height: clamp(260px, 38vw, 540px); }

.d-mprin { padding-top: clamp(72px, 9vw, 120px); }
.d-plist { display: grid; gap: clamp(28px, 4vw, 52px); }
.d-pcard { position: relative; isolation: isolate; display: grid; grid-template-columns: clamp(84px, 10vw, 128px) minmax(0, 5fr) minmax(0, 6fr); gap: clamp(16px, 3vw, 48px); align-items: start; padding: clamp(24px, 3.4vw, 44px); border-radius: 14px; }
.d-pcard.d-card { background: none; }
.d-pcard::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #d8d1ff; border-radius: 14px; rotate: 1.4deg; }
.d-pcard:nth-child(even)::before { rotate: -1.4deg; }
.d-pcard::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--paper); border-radius: 14px; box-shadow: 0 28px 50px -24px rgba(0, 0, 0, .6); }
.d-pnum { justify-self: start; padding: 10px 14px 6px; background: var(--night); color: var(--gold); border-radius: 6px; font: 900 clamp(3rem, 6vw, 5.5rem)/.9 var(--display); font-variant-numeric: tabular-nums; }
.d-pcard h2 { font-size: clamp(1.9rem, 3.6vw, 3rem); color: var(--ink); }
.d-ptext { max-width: 46ch; font-size: 1.1875rem; color: var(--ink-soft); }

.d-mno h2 { max-width: 12ch; color: #fff; }
.d-refused { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(24px, 5vw, 80px); margin-top: clamp(32px, 5vw, 64px); }
.d-refused li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 18px; min-height: 76px; padding: 14px 0; border-top: 2px dashed rgba(255, 211, 26, .4); }
.d-refused li:nth-last-child(-n+2) { border-bottom: 2px dashed rgba(255, 211, 26, .4); }
.d-refused svg { width: 44px; height: 44px; padding: 12px; background: var(--gold); color: var(--night); border-radius: 50%; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; }
.d-refused span { font: 800 clamp(1.375rem, 2.3vw, 1.875rem)/1.1 var(--display); letter-spacing: .02em; text-transform: uppercase; }

.d-mclose h2 { color: var(--ink); }
.d-mclose h2 em { color: var(--violet-deep); }
.d-mclose-text { max-width: 34ch; margin-top: 24px; font: 700 clamp(1.25rem, 2vw, 1.625rem)/1.35 var(--text); }
.d-mclose-acts { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: clamp(28px, 4vw, 48px); }
.d-mclose-acts .d-stub { height: auto; padding-block: 10px; }

.d-msrc { padding: clamp(48px, 6vw, 80px) 0 clamp(40px, 5vw, 64px); }
.d-msrc-grid { display: grid; grid-template-columns: .8fr 1.2fr 1fr; gap: clamp(20px, 4vw, 56px); align-items: start; }
.d-msrc-head strong { display: inline-block; padding: 9px 12px 7px; background: var(--night); color: var(--gold); border-radius: 4px; font: 800 1rem/1.2 var(--display); letter-spacing: .12em; }
.d-msrc-text { max-width: 46ch; color: var(--ink-soft); }
.d-msrc-links { display: grid; gap: 10px; justify-items: start; }
.d-msrc-links .d-stub { height: auto; padding-block: 8px; font-size: .875rem; }

@media (max-width: 1000px) {
  .d-pcard { grid-template-columns: auto minmax(0, 1fr); align-items: center; }
  .d-pcard h2 { grid-column: 2; }
  .d-ptext { grid-column: 1 / -1; }
  .d-mintro-grid, .d-msrc-grid { grid-template-columns: 1fr; }
  .d-mlead { max-width: 26ch; }
}
@media (max-width: 700px) {
  .d-mhero-char { position: static; display: block; width: 170px; margin: 28px -6px -112px auto; }
  .d-mhero { padding-bottom: 72px; }
  .d-refused { grid-template-columns: 1fr; }
  .d-refused li:nth-last-child(2) { border-bottom: 0; }
  .d-pnum { font-size: 2.75rem; }
}

/* on dark grounds the action is a gold seal */
.d-sec.d-night .d-act, .d-sec.d-violet .d-act { background: var(--gold); color: var(--night); }
.d-sec.d-night .d-act:hover, .d-sec.d-violet .d-act:hover { background: #fff; }

/* ---------- explorer quiz ---------- */
/* No namo.css here: give the page the base it used to inherit. */
body:has(.d-q) { margin: 0; background: #14123a; }
.d-qpage { background: #14123a; }
.d-q { display: flex; min-height: calc(100svh - var(--d-head-h)); }
.d-q > section { overflow-x: clip; flex: 1; display: flex; align-items: center; padding: clamp(36px, 5vw, 72px) 0 clamp(48px, 6vw, 88px); }
.d-q > section > .d-wrap { width: min(1200px, 100% - 2 * var(--gut)); }
.d-q button { font: inherit; }
.d-q h1:focus, .d-q h1:focus-visible { outline: none; }

.d-qcover { display: grid; grid-template-columns: 1.15fr .85fr; gap: clamp(28px, 6vw, 96px); align-items: center; }
.d-qcover h1 { color: #fff; font-size: clamp(3rem, 9vw, 6rem); }
.d-qcover h1 + .d-qlead { margin-top: clamp(24px, 3vw, 36px); }
.d-qlead { max-width: 30ch; font: 700 clamp(1.25rem, 2.2vw, 1.75rem)/1.3 var(--text); color: var(--lilac); }
.d-qcover .d-act { margin-top: clamp(28px, 4vw, 44px); }
.d-qsmall { display: block; margin-top: 18px; font: 600 .9375rem/1.4 var(--text); letter-spacing: .08em; color: var(--lilac); }
.d-qsignal { position: relative; width: min(420px, 100%); aspect-ratio: 1; justify-self: center; }
.d-qsignal::before { content: ""; position: absolute; inset: 6%; border-radius: 50%; background: var(--violet); box-shadow: 0 26px 40px -18px rgba(0, 0, 0, .55); }
.d-qsignal::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 3px dashed var(--gold); animation: d-spin 48s linear infinite; }
.d-qsignal img { position: absolute; left: 50%; top: 54%; width: 82%; height: auto; transform: translate(-50%, -50%); filter: drop-shadow(0 22px 18px rgba(0, 0, 0, .4)); }
@keyframes d-spin { to { rotate: 360deg; } }

.d-qwrap { display: grid; gap: clamp(20px, 3vw, 32px); max-width: 960px; }
.test-progress { display: flex; align-items: center; gap: 16px; }
.test-progress span { flex: none; padding: 9px 12px 7px; background: var(--gold); color: var(--night); border-radius: 4px; font: 800 1.125rem/1 var(--display); letter-spacing: .08em; font-variant-numeric: tabular-nums; }
.d-qbar { position: relative; flex: 1; height: 0; border-top: 3px dashed rgba(255, 211, 26, .4); }
.d-qbar i { position: absolute; left: 0; top: -3px; height: 3px; background: var(--gold); }
.question-game { display: grid; gap: 22px; }
.question-stage { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; align-items: end; }
.question-guide { position: relative; height: 170px; }
.question-guide span { position: absolute; z-index: 2; top: 0; right: 6px; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--gold); color: var(--night); font: 900 1.75rem/1 var(--display); rotate: 8deg; }
.question-character { position: absolute; left: 50%; bottom: 0; width: 150px; height: auto; transform: translateX(-50%); filter: drop-shadow(0 18px 14px rgba(0, 0, 0, .4)); }
.question-card { position: relative; isolation: isolate; padding: clamp(20px, 3vw, 32px); border-radius: 14px; color: var(--ink); --ring: var(--night); }
.question-card::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #d8d1ff; border-radius: 14px; rotate: -1.4deg; }
.question-card::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--paper); border-radius: 14px; box-shadow: 0 28px 50px -24px rgba(0, 0, 0, .6); }
.question-card-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px 24px; flex-wrap: wrap; }
.question-card .d-clue { margin-bottom: 0; flex: 1 1 200px; }
.question-card .d-clue b { background: var(--night); color: var(--gold); }
.decision-timer { flex: none; min-width: 124px; text-align: right; }
.decision-timer strong { display: block; font: 900 1.75rem/1 var(--display); letter-spacing: .06em; font-variant-numeric: tabular-nums; color: var(--ink); }
.timer-track { height: 6px; margin-top: 8px; border-radius: 3px; background: #d9d4f6; overflow: hidden; }
.timer-track i { display: block; height: 100%; background: var(--violet-deep); }
.decision-timer.is-urgent strong { color: #9d1c1c; animation: d-beat .65s ease-in-out infinite; }
.decision-timer.is-urgent .timer-track i { background: #9d1c1c; }
.decision-timer.is-expired strong { display: inline-block; padding: 6px 10px 4px; background: var(--night); color: var(--gold); border-radius: 4px; }
@keyframes d-beat { 50% { transform: scale(1.08); } }
.question-copy { margin-top: clamp(16px, 2.4vw, 24px); }
.question-copy h1 { font-size: clamp(2.5rem, 6vw, 4.5rem); color: var(--ink); }
.question-copy p { margin-top: 12px; max-width: 52ch; font-size: clamp(1.125rem, 1.7vw, 1.3125rem); }
.timer-message { min-height: 1.5em; margin-top: 14px; font: 600 .9375rem/1.5 var(--text); color: var(--ink-soft); }
.timer-message.is-visible { color: var(--violet-deep); font-weight: 700; }

.decision-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.decision-list button { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr) 24px; align-items: center; gap: 14px; min-height: 76px; padding: 12px 18px 12px 14px; text-align: left; color: var(--ink); background: var(--paper); border: 2px solid var(--night); border-radius: 10px; cursor: pointer; font: 600 1.0625rem/1.3 var(--text); transition: background-color .25s var(--ease), transform .35s var(--ease); }
.decision-list button span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--night); color: var(--gold); font: 900 1.375rem/1 var(--display); }
.decision-list button em { font-style: normal; }
.decision-list button svg { width: 22px; height: 22px; fill: none; stroke: var(--violet-deep); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; transition: transform .35s var(--ease); }
.decision-list button:hover:not(:disabled) { background: var(--gold); transform: translateY(-2px); }
.decision-list button:hover:not(:disabled) svg { transform: translateX(4px); stroke: var(--night); }
.decision-list button:focus-visible { border-radius: 10px; }
.decision-list button.is-chosen { background: var(--gold); }
.decision-list button:disabled { cursor: default; }
.decision-list button:disabled:not(.is-chosen) { opacity: .5; }

.test-result { --ring: var(--gold); }
.result-shell { position: relative; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(280px, .9fr); grid-template-areas: "clue slip" "title slip" "text slip" "acts slip"; column-gap: clamp(28px, 6vw, 96px); align-items: start; }
.result-shell > .d-clue { grid-area: clue; }
.result-shell > h1 { grid-area: title; color: #fff; }
.result-shell > h1 span, .result-shell > h1 em { display: block; }
.result-shell > h1 em { margin-top: 6px; color: var(--gold); font-size: .78em; }
.result-text { grid-area: text; max-width: 46ch; margin-top: clamp(20px, 3vw, 32px); font: 600 clamp(1.1875rem, 1.8vw, 1.4375rem)/1.45 var(--text); }
.d-rslip { grid-area: slip; align-self: center; max-width: 420px; }
.result-moment { --n: 40%; padding: 24px 24px 28px; }
.result-moment span { display: inline-block; padding: 8px 12px 6px; background: var(--night); color: var(--gold); border-radius: 4px; font: 800 1rem/1 var(--display); letter-spacing: .12em; }
.result-moment p { margin-top: 18px; font: 900 clamp(1.6rem, 2.6vw, 2.125rem)/1.1 var(--display); text-transform: uppercase; }
.result-actions { grid-area: acts; display: flex; flex-wrap: wrap; align-items: center; gap: 16px 24px; margin-top: clamp(28px, 4vw, 44px); }
.result-actions .d-act { height: auto; padding-block: 14px; text-align: left; line-height: 1.15; }
.result-actions .d-stub { font-family: var(--text); background: none; cursor: pointer; }
.result-character { position: absolute; z-index: 0; right: -4%; bottom: -12%; width: min(30vw, 360px); height: auto; opacity: .22; pointer-events: none; }
.result-shell > :not(.result-character) { position: relative; z-index: 1; }

@media (max-width: 800px) {
  .d-qcover { grid-template-columns: 1fr; }
  .d-qsignal { width: min(280px, 70%); order: -1; justify-self: start; }
  .question-stage { grid-template-columns: 84px minmax(0, 1fr); gap: 12px; }
  .question-guide { height: 100px; }
  .question-guide span { width: 32px; height: 32px; font-size: 1.25rem; top: -4px; right: -2px; }
  .question-character { width: 84px; }
  .decision-list { grid-template-columns: 1fr; gap: 10px; }
  .decision-list button { min-height: 68px; }
  .decision-timer { min-width: 0; text-align: left; }
  .result-shell { grid-template-columns: 1fr; grid-template-areas: "clue" "title" "text" "slip" "acts"; }
  .d-rslip { margin-top: 28px; justify-self: center; }
  .result-actions .d-act { font-size: 1.1875rem; padding-inline: 20px; }
  .result-character { width: 52vw; right: -14vw; bottom: 0; opacity: .14; }
}
@media (prefers-reduced-motion: reduce) {
  .d-qsignal::after { animation: none; }
  .decision-timer.is-urgent strong { animation: none; }
}

/* ---------- privacy and generic pages: a case file ---------- */
.d-case { min-height: 60vh; padding: clamp(48px, 6vw, 88px) 0 clamp(72px, 9vw, 120px); }
.d-case-title { position: relative; max-width: 14ch; margin: 0 0 clamp(32px, 5vw, 56px); padding-bottom: clamp(20px, 3vw, 28px); color: #fff; font-size: clamp(2.75rem, 8vw, 6rem); }
.d-case-title::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 6px; background: radial-gradient(circle, var(--gold) 1.7px, transparent 2.2px) 0 50% / 11px 6px repeat-x; opacity: .7; }
.d-sheet { position: relative; isolation: isolate; max-width: calc(68ch + 2 * clamp(24px, 4vw, 56px)); padding: clamp(24px, 4vw, 56px); border-radius: 14px; }
.d-sheet.d-card { background: none; }
.d-sheet::before { content: ""; position: absolute; inset: 0; z-index: -1; background: #d8d1ff; border-radius: 14px; rotate: 1.4deg; }
.d-sheet::after { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--paper); border-radius: 14px; box-shadow: 0 28px 50px -24px rgba(0, 0, 0, .6); }
.d-sheet-body { max-width: 68ch; font-size: 1.1875rem; line-height: 1.7; }
.d-sheet-body > * + * { margin-top: 1.1em; }
.d-sheet-body :is(h2, h3) { margin-top: 1.8em; color: var(--ink); }
.d-sheet-body h2 { font-size: clamp(1.75rem, 3vw, 2.5rem); }
.d-sheet-body h3 { font-size: clamp(1.4rem, 2.2vw, 1.875rem); }
.d-sheet-body :where(ul, ol) { padding-left: 1.4em; list-style: revert; }
.d-sheet-body a { color: var(--violet-deep); font-weight: 600; }
.d-sheet-body [data-placeholder] { padding: 20px 22px; border: 2px dashed var(--night); border-radius: 8px; color: var(--ink-soft); font-weight: 600; }
@media (max-width: 700px) { .d-case-title { max-width: none; } }