/* Hallmark · shape: long document · genre: playful · theme: custom · brand: Dotwing's locked look (Fıstık theme, spec 4.2) · job: read the privacy policy · idea: "the policy as a list of plain questions, each opening in place, under the same lit-dot head as the site" · vibe: "plain, short, nothing hidden that matters"
 * paper: oklch(81.1% 0.054 120.4) · accent: oklch(53.9% 0.184 31.6) · display: Dotwing's pixel font as SVG dots · body: Atkinson Hyperlegible Next · hero: the dot head, one line and the date · nav: as the site · footer: as the site · imagery: none · signature: each section a closed disclosure, the short version open first
 * axes: mid/pixel/chromatic-red · posture: drenched · contrast: pass · fold: pass · v2.0.0 */
/* Hallmark · pre-emit critique: P3 H4 E4 S4 R5 V3 · weakest: P, a policy argues nothing; it says what happens to data in the stores' required order, and the short version stays open */
/* Hallmark · waive 77 · a long document of eight disclosures at a 40rem measure · a legal text reads best in one narrow column, and the privacy page has no pictures to give it mass */
/* Hallmark · waive 78 · the section heads are disclosure summaries at text-xl inside a long document · the Dotwing policy keeps one dot head only, so the summaries read as a list of questions */
/* Hallmark · waive 49b · links that wrap sit inside running sentences of the policy, at 320 to 768px · a privacy text names Google, RevenueCat and Cloudflare policies in its own sentences, so the links follow the prose */
/* Hallmark · dismissed 58 · the English short version reads 83 words in its window, three plain bullets the policy cannot lose */
/* Hallmark · waive 59 · sections of a long document parted by hairlines, not by section gaps · eight policy disclosures stacked like a list need no 120px gaps between them */
/* The privacy policy: one column at a reading measure. */
.doc { padding-block: var(--space-2xl) var(--section-gap-s); }
.doc > * { max-width: 40rem; }
.doc-head { display: grid; gap: var(--space-md); padding-bottom: var(--space-xl); border-bottom: var(--rule-hair) solid var(--color-rule); }
.updated { color: var(--color-muted); font-size: var(--text-sm); }
.doc-body { display: grid; gap: 0; padding-top: var(--space-lg); }
.doc details { border-bottom: var(--rule-hair) solid var(--color-rule); }
.doc details[open] { padding-bottom: var(--space-lg); }
.doc details > :not(summary) { margin-top: var(--space-sm); }
.doc details:not([open]) > :not(summary) { display: none; }
.doc summary { display: flex; justify-content: space-between; gap: var(--space-md); padding-block: var(--space-md); cursor: pointer; list-style: none; border-radius: var(--radius-glass); }
.doc summary::-webkit-details-marker { display: none; }
.doc summary::after { content: "+"; font-weight: 700; font-size: var(--text-xl); line-height: 1; color: var(--color-accent); }
.doc details[open] > summary::after { content: "−"; }
.doc summary:hover h2 { text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: 2px; }
.doc summary:active { background: var(--color-paper-2); }
.doc summary:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.doc h2 { text-wrap: balance; }
.doc h2 { font-size: var(--text-xl); font-weight: 700; line-height: 1.2; }
.doc ul { margin: 0; padding-left: var(--space-lg); display: grid; gap: var(--space-xs); }
.doc a, .lost a { color: var(--color-ink); text-decoration-color: var(--color-accent); text-decoration-thickness: 2px; }
.doc a:hover, .lost a:hover { color: var(--color-accent-hover); }

