/* Generated by tools/dark-theme/build.py from front.css. Don't edit: change the source and run the script.
   Hand-made dark fixes go in /theme.css. */
:root:where([data-theme="dark"]) { --f-paper: #1f1e1b; --f-paper-2: #2b2a26; --f-ink: #e9e6e7; --f-ink-2: #cac8c5; --f-mute: #9a9792; --f-line: #3d3b36; }
:where([data-theme="dark"]) body.front { background: var(--f-paper); color: var(--f-ink); }
:where([data-theme="dark"]) .front a { color: inherit; text-decoration: none; }
:where([data-theme="dark"]) .front button { color: inherit; }
:where([data-theme="dark"]) .fn { background: var(--f-paper); }
:where([data-theme="dark"]) .fn.is-scrolled { box-shadow: 0 1px 0 rgba(20, 16, 17, .06); }
:where([data-theme="dark"]) .fn-pill, :where([data-theme="dark"]) .fn-icon { border: 1px solid var(--f-line); background: var(--f-paper); }
:where([data-theme="dark"]) .fn-pill:hover, :where([data-theme="dark"]) .fn-icon:hover { background: var(--f-paper-2); }
:where([data-theme="dark"]) .fn-dropmenu { background: #0f0f0f; border: 1px solid var(--f-line); box-shadow: 0 18px 50px rgba(20, 16, 17, .1); }
:where([data-theme="dark"]) .fn-dropmenu a:hover { background: var(--f-paper); }
:where([data-theme="dark"]) .fn-dropmenu span { color: var(--f-mute); }
:where([data-theme="dark"]) .fb { border: 1px solid var(--f-ink); }
:where([data-theme="dark"]) .fb-dark { background: var(--f-ink); color: #191816 !important; }
:where([data-theme="dark"]) .fb-dark:hover { background: #ddd9da; }
:where([data-theme="dark"]) .fb-line { background: transparent; }
:where([data-theme="dark"]) .fb-line:hover { background: var(--f-ink); color: #191816 !important; }
:where([data-theme="dark"]) .fw-box { background: var(--f-paper-2); }
:where([data-theme="dark"]) .fw-tile { background: #0f0f0f; }
:where([data-theme="dark"]) .fw-copy { background: #0f0f0f; box-shadow: 0 30px 80px rgba(20, 16, 17, .14), 0 2px 6px rgba(20, 16, 17, .05); }
:where([data-theme="dark"]) .fw-copy p { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fs-card { background: #191816; border: 1px solid var(--f-line); box-shadow: 0 -12px 40px rgba(20, 16, 17, .06); }
:where([data-theme="dark"]) .fs-text p { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fs-art { background: var(--f-paper-2); }
:where([data-theme="dark"]) .fs-dim { background: var(--f-ink); }
:where([data-theme="dark"]) .fs-deck .dk { background: #0f0f0f; box-shadow: 0 10px 30px rgba(20, 16, 17, .1); }
:where([data-theme="dark"]) .fs-pipe .app { background: #0f0f0f; border: 1px solid var(--f-line); }
:where([data-theme="dark"]) .fs-pipe .app i { color: var(--f-mute); }
:where([data-theme="dark"]) .fs-pipe .app .bar { background: var(--f-line); }
:where([data-theme="dark"]) .fs-pipe .app .bar span { background: var(--f-ink); }
:where([data-theme="dark"]) .fs-pipe .sink { background: var(--f-ink); color: #23221f; }
:where([data-theme="dark"]) .fs-pipe .sink i { color: #807971; }
:where([data-theme="dark"]) .fs-pipe svg.pp path { stroke: #4a4741; }
:where([data-theme="dark"]) .fs-pipe svg.pp circle { fill: var(--f-ink); }
:where([data-theme="dark"]) .fs-pipe .app:nth-of-type(4) svg path, :where([data-theme="dark"]) .fs-pipe .app:nth-of-type(5) svg path { fill: var(--f-ink); } /* GitHub and Notion are black marks */
:where([data-theme="dark"]) .fp-head p { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fp-body { color: #dddada; }
:where([data-theme="dark"]) .fp-body h2 { color: var(--f-ink); border-top: 1px solid var(--f-line); }
:where([data-theme="dark"]) .fp-body h3 { color: var(--f-ink); }
:where([data-theme="dark"]) .fp-body a { text-decoration: underline; text-decoration-color: #6c6760; }
:where([data-theme="dark"]) .fp-body a:hover { text-decoration-color: var(--f-ink); }
:where([data-theme="dark"]) .fp-body strong { color: var(--f-ink); }
:where([data-theme="dark"]) .fp-body th, :where([data-theme="dark"]) .fp-body td { border-bottom: 1px solid var(--f-line); }
:where([data-theme="dark"]) .fp-body th { color: var(--f-ink); }
:where([data-theme="dark"]) .fp-close { border-top: 1px solid var(--f-line); }
:where([data-theme="dark"]) .fp-close p { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fp-close a:not(.fb) { text-decoration: underline; }
:where([data-theme="dark"]) .fq .fq-lede { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fq-points, :where([data-theme="dark"]) .fq-done { border-top: 1px solid var(--f-line); }
:where([data-theme="dark"]) .fq-points p { border-bottom: 1px solid var(--f-line); color: var(--f-ink-2); }
:where([data-theme="dark"]) .fq-points strong, :where([data-theme="dark"]) .fq-done h2 { color: var(--f-ink); }
:where([data-theme="dark"]) .fq-done p { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fq-field span { color: var(--f-ink-2); }
:where([data-theme="dark"]) .fq-field input, :where([data-theme="dark"]) .fq-field textarea { color: var(--f-ink); background: #0f0f0f; border: 1px solid var(--f-line); outline: none; }
:where([data-theme="dark"]) .fq-field input:focus, :where([data-theme="dark"]) .fq-field textarea:focus { border-color: var(--f-ink); box-shadow: 0 0 0 3px rgba(20, 16, 17, .06); }
:where([data-theme="dark"]) .fq-field .invalid { border-color: #c4462f; }
:where([data-theme="dark"]) .fq-error { color: #c4462f; }
:where([data-theme="dark"]) .fq-fine { color: var(--f-mute); }
:where([data-theme="dark"]) .fq-fine a { text-decoration: underline; }
:where([data-theme="dark"]) .fw-box::before { background: radial-gradient(28% 32% at 20% 30%, rgba(44, 110, 221, 0.35), transparent 70%),
    radial-gradient(24% 28% at 80% 25%, rgba(232, 160, 32, 0.32), transparent 70%),
    radial-gradient(26% 30% at 70% 80%, rgba(102, 219, 177, 0.3), transparent 70%),
    radial-gradient(22% 26% at 25% 78%, rgba(229, 90, 60, 0.26), transparent 70%); }
