/* ============================================================ THE ATTENTION ADVANTAGE — citations & bibliography ------------------------------------------------------------ Split out of css/attention-advantage.css because all three pages that cite sources need these rules, and one of them is a standalone tool page that must NOT inherit the course page's print block (which hides every direct child of so the one-page guide can print alone). Loaded by: attention-advantage/index.html working-memory-stress-test/index.html the-attention-advantage.html ============================================================ */ /* ---- Footnote markers and the bibliography ---- */ .aa-cite { font-family: var(--font-mono); font-size: 0.72em; line-height: 0; margin-left: 1px; } .aa-cite a { color: var(--text-accent); text-decoration: none; padding: 0 1px; } .aa-cite a:hover { text-decoration: underline; } .aa-cite span { color: var(--text-tertiary); } .aa-refs { display: grid; gap: 14px; margin: 0; padding-left: 26px; counter-reset: none; } .aa-ref { padding: 16px 18px; border: 1px solid var(--border-subtle); border-radius: var(--radius-md, 10px); background: var(--surface-2); line-height: 1.6; } /* The bibliography is a jump target for every footnote marker on the page, so the entry has to be findable once you land on it. */ .aa-ref:target { border-color: var(--border-accent); background: var(--accent-subtle); } .aa-ref-cite { color: var(--text-primary); font-size: 14.5px; } .aa-ref-cite a { color: var(--text-accent); } .aa-ref-venue { color: var(--text-secondary); font-style: italic; } .aa-ref-note { margin-top: 10px; color: var(--text-secondary); font-size: 13.5px; line-height: 1.6; } .aa-ref-tag { display: inline-block; margin-right: 8px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--border-default); color: var(--text-tertiary); font: var(--fw-semibold) 10.5px/1.6 var(--font-mono); letter-spacing: 0.06em; text-transform: uppercase; white-space: nowrap; vertical-align: 1px; } /* Status colours carry meaning, so they are declared per theme rather than taken from the neutral ramp — see docs/COLOR_THEME.md rule 6. */ .aa-ref.is-strong .aa-ref-tag { color: var(--success-500); border-color: var(--success-500); } .aa-ref.is-contested .aa-ref-tag { color: var(--warning-500); border-color: var(--warning-500); } .aa-ref.is-retired .aa-ref-tag { color: var(--danger-500); border-color: var(--danger-500); } .aa-ref.is-retired .aa-ref-cite a { text-decoration: line-through; } /* ---- Claims we do not make ---- */ .aa-retired { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; } .aa-retired-item { padding: 22px; border: 1px solid var(--border-default); border-left: 3px solid var(--danger-500); border-radius: var(--radius-md, 10px); background: var(--surface-2); } .aa-retired-item h3 { margin: 0 0 10px; font-size: 1rem; font-weight: var(--fw-semibold); } .aa-retired-item p { margin: 0; color: var(--text-secondary); font-size: 14px; line-height: 1.6; } .aa-retired-ref { display: inline-block; margin-top: 12px; color: var(--text-accent); font-size: 13px; }