/* AntiFind page: extra rules on top of the site's style.css. */
.term { margin: 30px 0 0; border-radius: 14px; overflow: hidden; border: 1px solid #22394A;
  background: #0B1620; color: #E8EEF2; box-shadow: 0 18px 50px rgba(8, 40, 60, .22); }
/* Linux terminal: a GNOME (Adwaita) header bar, the title centred and flat round buttons on the right.
   The PowerShell window (.term.win) has the title on the left and Windows' square glyphs on the right.
   No coloured "traffic lights": AntiFind does not run on a Mac yet. */
.term .bar { position: relative; display: flex; align-items: center; justify-content: flex-end; gap: 8px; min-height: 44px; box-sizing: border-box;
  padding: 8px 12px; background: #242424; border-bottom: 1px solid #1A1A1A; }
.term .bar span { order: 1; flex: 1; min-width: 0; padding-left: 88px; text-align: center; font: 700 13.5px/1.3 system-ui, "Cantarell", "Segoe UI", sans-serif;
  color: #EDEDED; overflow-wrap: anywhere; }
.term .bar i { order: 2; position: relative; width: 24px; height: 24px; border-radius: 50%; display: block; background: rgba(255, 255, 255, .10); flex: none; }
.term .bar i::before, .term .bar i::after { content: ""; position: absolute; left: 50%; top: 50%; background: #EDEDED; }
.term .bar i:nth-child(1)::before { width: 8px; height: 1.6px; transform: translate(-50%, 2px); }
.term .bar i:nth-child(1)::after { display: none; }
.term .bar i:nth-child(2)::before { width: 6px; height: 6px; background: none; border: 1.6px solid #EDEDED; border-radius: 1.5px; transform: translate(-50%, -50%); }
.term .bar i:nth-child(2)::after { display: none; }
.term .bar i:nth-child(3)::before, .term .bar i:nth-child(3)::after { width: 10px; height: 1.6px; }
.term .bar i:nth-child(3)::before { transform: translate(-50%, -50%) rotate(45deg); }
.term .bar i:nth-child(3)::after { transform: translate(-50%, -50%) rotate(-45deg); }
.term { background: #1E1E1E; border-color: #2E2E2E; }
.term.win { background: #0C0C0C; border-color: #2B2B2B; }
.term.win .bar { background: #1F1F1F; padding: 0 0 0 16px; gap: 0; min-height: 40px; border-bottom-color: #2B2B2B; }
.term.win .bar span { padding-left: 0; text-align: left; font: 400 13px/1.3 "Segoe UI", system-ui, sans-serif; padding: 10px 0; }
.term.win .bar i { width: 46px; height: 40px; border-radius: 0; background: transparent; }
.term.win .bar i:nth-child(3)::before, .term.win .bar i:nth-child(3)::after { width: 12px; height: 1px; }
.term.win .bar i:nth-child(1)::before { width: 10px; height: 1px; transform: translate(-50%, 0); }
.term.win .bar i:nth-child(2)::before { width: 8px; height: 8px; border-width: 1px; border-radius: 0; }
.term pre { margin: 0; padding: 22px 24px 26px; overflow-x: auto; font: 14.5px/1.75 ui-monospace, "SF Mono", "Cascadia Code", Menlo, Consolas, monospace; }
.term .p { color: #6FCF9F; } .term .q { color: #FFD23F; } .term .d { color: #3FD1C7; } .term .f { color: #FFFFFF; font-weight: 600; }
.term .n { color: #A9B8C4; } .term .s { color: #FF9C8C; } .term .m { color: #A9B8C4; font-style: italic; }
/* Install blocks: a Copy button in the title bar copies the commands only. The bar is dark in both
   themes, so the label is the bar's light grey, and the frame and focus take the theme accent. */
.term .bar.has-copy span { padding-left: 8px; }
.term .af-copy { order: 0; box-sizing: border-box; min-width: 80px; height: 30px; padding: 0 12px; border-radius: 999px;
  border: 2px solid var(--accent); background: transparent; color: #EDEDED; cursor: pointer; text-align: center;
  font: 700 12.5px/1 system-ui, "Cantarell", "Segoe UI", sans-serif; transition: background .15s ease-in-out, transform .15s ease-in-out; }
.term .af-copy:hover { background: color-mix(in srgb, var(--accent) 18%, #242424); }
.term .af-copy:active { transform: translateY(1px); background: color-mix(in srgb, var(--accent) 32%, #242424); }
.term .af-copy:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.term .af-copy.is-done { background: var(--accent); color: var(--accent-ink); }
.term .af-copy:disabled { opacity: .5; cursor: default; }
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin: 18px 0 0; }
.steps b { display: block; margin-bottom: 6px; } .steps span { color: var(--muted); font-size: 14.5px; line-height: 1.55; display: block; }
.tag { display: inline-block; font-size: 10.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: 2px 8px;
  border-radius: 99px; background: var(--soft); color: var(--muted); border: 1px solid var(--line); margin-left: 8px; vertical-align: 2px; }
table.install { border-collapse: collapse; width: 100%; max-width: 900px; margin: 12px 0 0; }
table.install th, table.install td { text-align: left; padding: 11px 14px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 15px; }
table.install code, pre.cmd { font: 13.5px/1.6 ui-monospace, Menlo, Consolas, monospace; }
pre.cmd { background: var(--soft); border: 1px solid var(--line); border-radius: 10px; padding: 14px 18px; overflow-x: auto; margin: 12px 0 0; max-width: 900px; }
@media (max-width: 720px) { .steps { grid-template-columns: 1fr; } .term pre { font-size: 12.5px; padding: 16px; } .term .bar span { padding-left: 4px; text-align: left; } }
/* Hero: the text sits in a soft card of the page colour, kept narrow and short so
   it stays above and beside the palm art at every width from 1024 to 2560 px. */
.af-intro { max-width: 640px; }
.af-intro .tagline { max-width: 60ch; }
.af-intro .af-lead { max-width: 60ch; color: var(--muted, inherit); margin-top: 0.75em; }
.af-one { grid-template-columns: minmax(0, 760px) !important; }
.af-table { overflow-x: auto; }
.af-more { font-size: 18px; font-weight: 600; }
.af-more a { color: var(--accent); }

/* the caption under the hero terminal sits on the art at wide widths: give it its own surface */
.af-caption { display: inline-block; margin-top: 12px; padding: 4px 12px; border-radius: 99px;
  background: var(--soft); border: 1px solid var(--line); }
/* the speed table: numbers never break inside; on a phone it scrolls sideways */
#speed .af-table td:not(:first-child), #speed .af-table th { white-space: nowrap; }
#speed .af-table td:first-child { min-width: 9em; }
.term.walk .c { color: #FFD23F; font-weight: 700; } .term.walk .cm { color: #8FA3B3; }

/* Product page, 2026-10-19 rewrite */
.sec h3 { margin: 44px 0 6px; font-size: 20px; line-height: 1.3; }
.sec h3 + p { margin-top: 6px; }
.sec .term { margin-top: 16px; }
.af-cta { display: flex; flex-wrap: wrap; gap: 12px; margin: 22px 0 6px; }
.af-btn { display: inline-block; padding: 12px 22px; border-radius: 999px; font-weight: 700; text-decoration: none;
  background: var(--accent); color: var(--accent-ink); border: 2px solid var(--accent); }
.af-btn:hover { filter: brightness(1.08); }
.af-btn.ghost { background: transparent; color: var(--accent); }
.af-two { display: block; }
.af-two > div { min-width: 0; }
.af-shots { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; margin-top: 22px; }
.af-shots figure { margin: 0; }
.af-shots img { width: 100%; border: 1px solid var(--line); border-radius: 12px; display: block; }
.af-shots figcaption { color: var(--muted); font-size: 14px; margin-top: 8px; }
.af-faq details { border-bottom: 1px solid var(--line); padding: 14px 0; max-width: 860px; }
.af-faq summary { cursor: pointer; font-weight: 700; font-size: 17px; }
.af-faq details[open] summary { margin-bottom: 8px; }
.af-faq p { margin: 0; }
.term pre .c { color: #FFD23F; font-weight: 700; }
.term pre .cm { color: #8FA3B3; }
.term pre { max-width: 100%; }
p code, li code, td code { overflow-wrap: anywhere; }
@media (max-width: 860px) {
  .af-two, .af-shots { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  .wrap { padding: 0 16px; }
  .af-btn { width: 100%; text-align: center; }
  .sec { margin-top: 64px; }
}
.sec .term + p, .sec .af-table + .term { margin-top: 20px; }
.sec .af-table { margin-bottom: 16px; }

/* ===== Product page, direction A (2026-10-20) ===== */
:root {
  --win: #2F6FD0; --win-t: #E0EAFB; --lin: #8F5F00; --lin-t: #FBEFD2; --mac: #4F4B45; --mac-t: #ECEAE4; --zfs: #1F7A47; --zfs-t: #DFF1E6;
  --teal: #0D6680; --teal-t: #DCEEF2; --shadow: 0 2px 6px rgba(40,30,10,.06), 0 22px 60px rgba(40,30,10,.14);
  /* the backdrop: one swappable picture per theme; backdrop.js swaps them in a season */
  --af-bd-day: url("img/lofi-day.svg"); --af-bd-night: url("img/lofi-night.svg");
  --af-backdrop: var(--af-bd-day); --beach: none;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --win: #7FB0F5; --win-t: #18263D; --lin: #F2C230; --lin-t: #3A3016; --mac: #C9C6BF; --mac-t: #2A2D33; --zfs: #5FC48A; --zfs-t: #173021;
    --teal: #4FB3CF; --teal-t: #15323B; --shadow: 0 2px 6px rgba(0,0,0,.4), 0 22px 60px rgba(0,0,0,.55);
    --af-backdrop: var(--af-bd-night); --beach: none;
  }
}
:root[data-theme="dark"] {
  --win: #7FB0F5; --win-t: #18263D; --lin: #F2C230; --lin-t: #3A3016; --mac: #C9C6BF; --mac-t: #2A2D33; --zfs: #5FC48A; --zfs-t: #173021;
  --teal: #4FB3CF; --teal-t: #15323B; --shadow: 0 2px 6px rgba(0,0,0,.4), 0 22px 60px rgba(0,0,0,.55);
  --af-backdrop: var(--af-bd-night); --beach: none;
}
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.ph { color: var(--muted); font-style: italic; border-bottom: 1px dashed var(--line); }
.owner { font-weight: 800; color: var(--accent); }

/* Hero: the room is behind the hero only, on the right; the text sits on the calm wall to the left
   with a soft warm scrim; the picture fades into the page below, never behind the sections. */
.af-herowrap { position: relative; isolation: isolate; padding-bottom: 36px; }
.af-herowrap::before { content: ""; position: absolute; top: 0; right: 0; width: min(100%, 1180px); aspect-ratio: 1180 / 740; z-index: -2;
  background: var(--af-backdrop) right top / cover no-repeat;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 30%), linear-gradient(to bottom, #000 68%, transparent 100%);
  -webkit-mask-composite: source-in;
  mask-image: linear-gradient(to right, transparent 0, #000 30%), linear-gradient(to bottom, #000 68%, transparent 100%); mask-composite: intersect; }
.af-herowrap::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 740px; z-index: -1; pointer-events: none;
  background: linear-gradient(to right, color-mix(in srgb, var(--bg) 92%, transparent) 0%, color-mix(in srgb, var(--bg) 84%, transparent) 40%, transparent 64%); }
.af-herowrap .hero { padding-bottom: 0; }
.af-herowrap h1 { max-width: 14ch; }
.af-intro { max-width: 520px; min-height: 500px; }
.af-duo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr); gap: 26px; margin-top: 44px; align-items: start; }
.af-duo .lab { display: flex; gap: 10px; align-items: center; margin-bottom: 12px; font-size: 15px; color: var(--muted); }
.af-duo .term { margin: 0; }
.os { display: inline-flex; align-items: center; gap: 8px; font-weight: 700; font-size: 15px; padding: 5px 14px; border-radius: 999px; border: 2px solid var(--line); background: var(--card); }
.os svg { width: 18px; height: 18px; }
.os.lin { color: var(--lin); } .os.win { color: var(--win); }

/* Pictures: large, one theme shown, opened in the lightbox */
button.af-shot { display: block; width: 100%; padding: 0; margin: 0; border: 2px solid var(--line); border-radius: 16px; background: var(--card);
  box-shadow: var(--shadow); cursor: zoom-in; overflow: hidden; font: inherit; color: inherit; }
button.af-shot:hover { border-color: var(--accent); }
button.af-shot:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
button.af-shot { line-height: 0; }
button.af-shot img { width: 100%; height: auto; vertical-align: top; }
.af-view { margin: 72px 0 0; }
.af-view .txt { max-width: 760px; margin-bottom: 20px; }
.af-view h3 { font-size: 24px; margin: 0 0 6px; }

/* Filesystems */
.af-fs { margin-top: 36px; }
.af-fsgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(270px, 1fr)); gap: 18px; margin-top: 26px; }
.af-fscard { background: var(--card); border: 2px solid var(--line); border-radius: 18px; padding: 22px; min-width: 0; }
.af-fscard header { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.af-fscard .sig { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; flex: none; }
.af-fscard .sig svg { width: 28px; height: 28px; }
.af-fscard h3 { margin: 0; font-size: 21px; }
.af-fscard table { width: 100%; border-collapse: collapse; font-size: 14px; }
.af-fscard th { font-size: 12px; color: var(--muted); font-weight: 700; text-align: center; padding: 0 4px 8px; }
.af-fscard th:first-child { text-align: left; }
.af-fscard td { padding: 7px 4px; border-top: 1px solid var(--line); text-align: center; vertical-align: middle; }
.af-fscard td:first-child { text-align: left; }
.af-fscard .fs { display: inline-block; font-weight: 800; font-size: 17px; padding: 3px 11px; border-radius: 10px; }
.af-fscard .yes { font-weight: 800; font-size: 18px; }
.af-fscard .no { color: var(--muted); }
.af-fscard .ro { font-size: 12px; font-weight: 700; white-space: nowrap; }
.af-fscard .yes, .af-fscard .ro { display: inline-block; min-width: 28px; padding: 1px 8px; border-radius: 8px; }
.af-fscard[data-sys="win"] .fs, .af-fscard[data-sys="win"] .sig, .af-fscard[data-sys="win"] .yes, .af-fscard[data-sys="win"] .ro { background: var(--win-t); color: var(--win); }
.af-fscard[data-sys="lin"] .fs, .af-fscard[data-sys="lin"] .sig, .af-fscard[data-sys="lin"] .yes, .af-fscard[data-sys="lin"] .ro { background: var(--lin-t); color: var(--lin); }
.af-fscard[data-sys="mac"] .fs, .af-fscard[data-sys="mac"] .sig, .af-fscard[data-sys="mac"] .yes, .af-fscard[data-sys="mac"] .ro { background: var(--mac-t); color: var(--mac); }
.af-fscard[data-sys="zfs"] .fs, .af-fscard[data-sys="zfs"] .sig, .af-fscard[data-sys="zfs"] .yes, .af-fscard[data-sys="zfs"] .ro { background: var(--zfs-t); color: var(--zfs); }
.af-fsnote { margin-top: 20px; color: var(--muted); font-size: 15px; max-width: 80ch; }
.af-fsmore { margin-top: 16px; }
.af-fsmore summary { cursor: pointer; font-weight: 700; }

/* Numbers */
.af-nums { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 18px; margin-top: 26px; }
.af-nums > div { background: var(--card); border: 2px solid var(--line); border-radius: 18px; padding: 22px; }
.af-num { font-size: clamp(34px, 4vw, 44px); font-weight: 800; color: var(--teal); line-height: 1.05; display: block; }
.af-nums span.cap { color: var(--muted); font-size: 15px; display: block; margin-top: 6px; }

/* Comparison */
.af-cmpwrap { overflow-x: auto; margin-top: 26px; border-radius: 18px; border: 2px solid var(--line); background: var(--card); }
table.af-cmp { width: 100%; border-collapse: collapse; font-size: 16px; min-width: 720px; }
.af-cmp th, .af-cmp td { padding: 13px 16px; text-align: left; border-bottom: 1px solid var(--line); }
.af-cmp thead th { font-size: 14px; color: var(--muted); font-weight: 700; }
.af-cmp th:nth-child(2), .af-cmp td:nth-child(2) { background: var(--teal-t); font-weight: 700; }
.af-cmp td.y { color: var(--teal); font-weight: 700; }
.af-cmp tbody th { color: var(--fg); font-size: 16px; font-weight: 600; }
.af-cmp tr:last-child td, .af-cmp tr:last-child th { border-bottom: 0; }

/* Family */
.af-fam { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin-top: 26px; }
.af-famc { background: var(--card); border: 2px solid var(--line); border-radius: 18px; padding: 24px; }
.af-famc .ic { width: 52px; height: 52px; border-radius: 14px; margin-bottom: 14px; display: grid; place-items: center; font-weight: 800; color: #fff; }
.af-famc h3 { margin: 0 0 6px; font-size: 20px; }

/* Lightbox */
html.af-lb-on { overflow: hidden; }
.af-lb { position: fixed; inset: 0; z-index: 1000; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px;
  background: rgba(8, 14, 18, .92); padding: 56px 72px 20px; touch-action: pan-y; }
.af-lb[hidden] { display: none; }
.af-lb figure { margin: 0; min-height: 0; display: grid; place-items: center; }
.af-lb img { max-width: min(96vw, 2400px); max-height: calc(100vh - 150px); width: auto; height: auto; border-radius: 12px; box-shadow: 0 30px 80px rgba(0,0,0,.6); background: #fff; }
.af-lb .cap { color: #E6EEF2; font-size: 15px; text-align: center; margin: 0; max-width: none; }
.af-lb button { position: absolute; width: 52px; height: 52px; border-radius: 12px; border: 2px solid rgba(255,255,255,.35); background: rgba(255,255,255,.12);
  color: #fff; font-size: 26px; line-height: 1; cursor: pointer; display: grid; place-items: center; }
.af-lb button:hover { background: rgba(255,255,255,.24); }
.af-lb button:focus-visible { outline: 3px solid #FFD23F; outline-offset: 2px; }
.af-lb .x { top: 14px; right: 14px; } .af-lb .l { left: 12px; top: 50%; transform: translateY(-50%); } .af-lb .r { right: 12px; top: 50%; transform: translateY(-50%); }
@media (max-width: 720px) {
  .af-lb { padding: 56px 8px 16px; }
  .af-lb .l, .af-lb .r { top: auto; bottom: 10px; transform: none; width: 46px; height: 46px; }
  .af-lb .l { left: 14px; } .af-lb .r { right: 14px; }
}

@media (max-width: 860px) {
  .af-duo { grid-template-columns: minmax(0, 1fr); }
  .af-intro { min-height: 0; max-width: 580px; }
  .af-herowrap::before { width: 100%; aspect-ratio: auto; height: 480px; background-position: 72% 0; background-size: auto 480px; opacity: .6;
    -webkit-mask-image: linear-gradient(to bottom, #000 45%, transparent 100%); mask-image: linear-gradient(to bottom, #000 45%, transparent 100%); }
  .af-herowrap::after { height: 480px; background: linear-gradient(to bottom, color-mix(in srgb, var(--bg) 82%, transparent), color-mix(in srgb, var(--bg) 60%, transparent) 60%, transparent); }
}
@media (max-width: 560px) { .af-view { margin-top: 52px; } }

/* The find, locate, AntiFind comparison under the numbers */
.af-story { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 18px; margin: 26px 0 8px; }
.af-story > div { background: var(--card); border: 2px solid var(--line); border-radius: 18px; padding: 18px 22px; }
.af-story h3 { margin: 0 0 6px; font-size: 18px; }
.af-story p { margin: 0; }

/* ===== The claim and the proof first; a real phone layout (2026-10-20, b) =====
   Spacing on the 4/8 px scale. Selection and emphasis are tinted backgrounds, never bars. */
.af-intro { min-height: 0; max-width: 580px; }
.af-eyebrow { display: inline-flex; align-items: center; gap: 8px; margin: 64px 0 0; padding: 8px 16px; border-radius: 999px;
  font-size: 14px; font-weight: 700; letter-spacing: .02em; color: var(--fg);
  background: color-mix(in srgb, var(--sun) 34%, var(--card)); }
.af-eyebrow::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--coral); flex: none;
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--coral) 28%, transparent); }
.af-herowrap .hero h1 { margin-top: 16px; }
.af-claim { font-size: clamp(22px, 2.6vw, 30px); line-height: 1.2; letter-spacing: -.01em; margin: 16px 0 0; }
.af-hero .tagline { margin: 16px 0 0; max-width: 500px; }
.af-plat { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; padding: 0; margin: 24px 0 0; }
.af-plat .os { font-size: 14px; padding: 6px 14px; }
.af-plat .os.soon { color: var(--muted); background: transparent; border-style: dashed; font-weight: 600; }
.af-plat .os.soon .ph { border: 0; }
.af-hero .af-cta { margin: 24px 0 8px; }
.af-room { display: none; }

/* buttons: hover, pressed, focus */
.af-btn { box-sizing: border-box; display: inline-block; padding: 13px 24px; line-height: 1.35; text-align: center;
  transition: filter .15s ease-in-out, transform .15s ease-in-out; }
.af-btn:hover { filter: brightness(1.08); }
.af-btn.ghost { background: color-mix(in srgb, var(--card) 88%, transparent); }
.af-btn.ghost:hover { background: color-mix(in srgb, var(--accent) 12%, var(--card)); filter: none; }
.af-btn:active { transform: translateY(1px); filter: brightness(.94); }
.af-btn:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }
.nav a.lnk:focus-visible, .af-fsmore summary:focus-visible, .af-faq summary:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; border-radius: 6px; }

/* The proof: one framed surface right under the hero, over the fading room */
.af-proof { position: relative; margin: 40px 0 0; padding: 32px; border-radius: 24px; background: var(--card);
  border: 2px solid var(--line); box-shadow: var(--shadow);
  display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 24px 40px; }
.af-proof h2 { margin: 0; font-size: clamp(30px, 3.6vw, 44px); line-height: 1.1; letter-spacing: -.02em; }
.af-proof-lede { font-size: clamp(18px, 1.8vw, 21px); color: var(--fg); font-weight: 600; margin: 8px 0 0; }
.af-race-how { margin: 16px 0 0; font-size: 14px; color: var(--muted); }
.af-race { list-style: none; margin: 16px 0 0; padding: 0; display: grid; gap: 8px; }
.af-race li { display: grid; grid-template-columns: 96px minmax(0, 1fr) 80px; align-items: center; gap: 16px;
  padding: 8px 16px; border-radius: 12px; font-size: 15px; }
.af-race .t { font-weight: 600; color: var(--muted); }
.af-race .v { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.af-race .track { height: 12px; border-radius: 99px; background: color-mix(in srgb, var(--line) 55%, transparent); overflow: hidden; }
.af-race .bar { display: block; height: 100%; width: var(--w); min-width: 6px; border-radius: 99px;
  background: color-mix(in srgb, var(--muted) 55%, var(--card)); }
.af-race li.me { background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
.af-race li.me .t, .af-race li.me .v { color: var(--accent); font-weight: 800; }
.af-race li.me .v { font-size: 20px; }
.af-race li.me .bar { background: var(--accent); min-width: 8px; }
.af-proof-facts { display: grid; gap: 16px; align-content: start; }
.af-proof-facts > div { padding: 24px; border-radius: 18px; background: color-mix(in srgb, var(--coral) 16%, var(--card)); }
.af-proof-facts > div + div { background: color-mix(in srgb, var(--sea) 14%, var(--card)); }
.af-proof-facts .af-num { font-size: clamp(32px, 3.4vw, 44px); font-weight: 800; color: var(--fg); line-height: 1.05; display: block; white-space: nowrap; }
.af-proof-facts .cap { color: var(--muted); font-size: 15px; display: block; margin-top: 8px; }
.af-proof-why { grid-column: 1 / -1; margin: 0; max-width: 72ch; color: var(--fg); font-size: 17px; }
/* find, locate, AntiFind: one strip read from left to right, AntiFind tinted at the end */
.af-proof .af-story { grid-column: 1 / -1; margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0;
  border: 2px solid var(--line); border-radius: 18px; overflow: hidden; }
.af-proof .af-story > div { border: 0; border-radius: 0; background: transparent; padding: 16px 24px; position: relative; }
.af-proof .af-story > div + div { border-left: 2px solid var(--line); }
.af-proof .af-story > div.me { background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
.af-proof .af-story > div.me h3 { color: var(--accent); }
.af-proof .af-story h3 { font-size: 17px; margin: 0 0 4px; }
.af-proof .af-story p { font-size: 15px; color: var(--muted); }
.af-proof .af-story > div.me p { color: var(--fg); }
.af-proof-note { grid-column: 1 / -1; margin: 0; font-size: 14px; color: var(--muted); max-width: 90ch; }
.af-fs { margin-top: 72px; }
#speed .af-table { margin-top: 16px; }

/* ----- Phone: a layout of its own, not a squeezed desktop ----- */
@media (max-width: 720px) {
  .nav nav { overflow: visible; white-space: normal; display: flex; flex-wrap: wrap; gap: 8px; }
  .nav nav a.lnk { margin: 0; padding: 8px 14px; min-height: 40px; box-sizing: border-box; display: inline-flex; align-items: center;
    border-radius: 999px; background: color-mix(in srgb, var(--card) 70%, transparent); border: 1px solid var(--line); color: var(--fg); }
  .nav nav a.lnk:hover { background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
  .nav nav a.lnk:active { background: color-mix(in srgb, var(--accent) 22%, var(--card)); }
  .nav .look { width: 40px; height: 40px; }

  .af-herowrap::before, .af-herowrap::after { display: none; }
  .af-herowrap { padding-bottom: 0; }
  .af-eyebrow { margin-top: 24px; font-size: 13px; padding: 8px 14px; }
  .af-herowrap .hero h1 { font-size: clamp(36px, 10.6vw, 46px); line-height: 1.04; margin-top: 16px; max-width: none; }
  .af-claim { font-size: 23px; }
  /* the room, cropped to the girl, the cat and the desk */
  .af-room { display: block; margin: 24px -16px 0; height: clamp(208px, 58vw, 250px);
    background: var(--af-backdrop) 70% 86% / 190% auto no-repeat;
    -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 16%, #000 80%, transparent 100%);
    mask-image: linear-gradient(to bottom, transparent 0, #000 16%, #000 80%, transparent 100%); }
  .af-hero .tagline { margin-top: 8px; font-size: 18px; }
  .af-hero .af-cta, .sec .af-cta { flex-direction: column; gap: 12px; }
  .af-btn { display: block; width: 100%; padding: 16px 20px; font-size: 17px; text-align: center; }
  .af-hero .status { margin-top: 8px; }

  .af-proof { grid-template-columns: minmax(0, 1fr); padding: 24px 16px; margin: 40px -8px 0; border-radius: 20px; gap: 24px; }
  .af-proof h2 { font-size: 32px; }
  .af-race li { grid-template-columns: minmax(0, 1fr) auto; gap: 8px 12px; padding: 8px 12px; }
  .af-race .track { grid-column: 1 / -1; grid-row: 2; }
  .af-proof-facts > div { padding: 16px 20px; }
  .af-proof .af-story { grid-template-columns: minmax(0, 1fr); }
  .af-proof .af-story > div { padding: 16px 20px; }
  .af-proof .af-story > div + div { border-left: 0; border-top: 2px solid var(--line); }
  .af-fs { margin-top: 56px; }

  /* filesystem cards become one compact list */
  .af-fsgrid { grid-template-columns: minmax(0, 1fr); gap: 0; margin-top: 24px; border: 2px solid var(--line); border-radius: 18px;
    background: var(--card); overflow: hidden; }
  .af-fscard { border: 0; border-radius: 0; padding: 16px; background: transparent; }
  .af-fscard + .af-fscard { border-top: 2px solid var(--line); }
  .af-fscard header { margin-bottom: 8px; gap: 12px; }
  .af-fscard .sig { width: 36px; height: 36px; border-radius: 10px; }
  .af-fscard .sig svg { width: 20px; height: 20px; }
  .af-fscard h3 { font-size: 18px; }
  .af-fscard thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .af-fscard table, .af-fscard tbody { display: block; }
  .af-fscard tr { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 8px 0; border-top: 1px solid var(--line); }
  .af-fscard td { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; font-size: 14px; }
  .af-fscard td:first-child { min-width: 76px; }
  .af-fscard td[data-l]::after { content: attr(data-l); color: var(--fg); font-size: 14px; }
  .af-fscard td[data-l="From Windows"]::after { content: none; }
  .af-fscard td[data-l="From Windows"]::before { content: attr(data-l); color: var(--fg); font-size: 14px; }
  .af-fscard td:has(.no) { display: none; }
  .af-fscard .yes { font-size: 15px; min-width: 0; padding: 1px 6px; }
  .af-fscard .fs { font-size: 16px; }

  /* tables: one block per row, each value under its column's name */
  table.af-stack, table.af-stack tbody, table.af-stack tr, table.af-stack td, table.af-stack th { display: block; width: auto; }
  table.af-stack { min-width: 0 !important; max-width: 100%; }
  table.af-stack tr:first-child:not(:has(td)), table.af-stack thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  table.af-stack tr { padding: 16px 0; border-bottom: 1px solid var(--line); }
  table.af-stack td, table.af-stack th { padding: 4px 0; border: 0; white-space: normal !important; min-width: 0 !important; }
  table.af-stack td:first-child, table.af-stack th[scope="row"] { font-weight: 700; font-size: 16px; color: var(--fg); }
  table.af-stack td[data-l]::before { content: attr(data-l); display: block; font-size: 12px; font-weight: 700; letter-spacing: .04em;
    color: var(--muted); margin-bottom: 2px; }
  table.af-stack2 td:first-child { padding-bottom: 0; }
  /* the speed table: four tools in a 2 x 2 grid, AntiFind tinted */
  #speed table.af-stack tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  #speed table.af-stack td:first-child { grid-column: 1 / -1; }
  #speed table.af-stack td[data-l] { padding: 8px 12px; border-radius: 10px; background: var(--soft); }
  #speed table.af-stack td[data-l="AntiFind"] { background: color-mix(in srgb, var(--accent) 14%, var(--card)); color: var(--accent); }
  /* the filesystem details: where, then the filesystem as the heading */
  .af-fsmore table.af-stack td:first-child { font-size: 12px; font-weight: 700; letter-spacing: .04em; color: var(--muted); text-transform: uppercase; }
  .af-fsmore table.af-stack td:nth-child(2) { font-weight: 700; font-size: 16px; }
  .af-fsmore table.af-stack td:nth-child(2)::before { content: none; }
  /* the comparison: each feature a block, the tools in a 2-column grid, AntiFind first and tinted */
  .af-cmpwrap { overflow: visible; padding: 0 16px; }
  .af-cmp tr { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .af-cmp tbody tr:last-child { border-bottom: 0; }
  .af-cmp th[scope="row"] { grid-column: 1 / -1; }
  .af-cmp td { padding: 8px 12px !important; border-radius: 10px; background: var(--soft) !important; font-size: 15px; }
  .af-cmp td:nth-child(2) { background: color-mix(in srgb, var(--accent) 14%, var(--card)) !important; }
  .af-table { overflow-x: visible; }
  .af-fam { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .af-famc { padding: 20px; }
}
@media (max-width: 380px) {
  .nav nav a.lnk { padding: 8px 12px; font-size: 13.5px; }
}

/* The owner's line on the two ways to use it, high in the hero: command line or app, links to both sections. */
.af-choice { margin: 24px 0 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; }
.af-choice-line { margin: 0; font-weight: 800; font-size: clamp(18px, 1.8vw, 21px); color: var(--fg); }
.af-modes { margin: 0; display: flex; gap: 8px; flex-wrap: wrap; }
.af-mode { white-space: nowrap; display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 6px 16px; border-radius: 999px; border: 2px solid var(--line); background: var(--card); color: var(--fg); font-weight: 700; font-size: 15px; text-decoration: none; transition: background .15s, border-color .15s, transform .08s; }
.af-mode:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--card)); }
.af-mode:active { transform: translateY(1px); background: color-mix(in srgb, var(--accent) 18%, var(--card)); }
.af-mode:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.af-mode-ico { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-weight: 800; color: var(--accent); }
@media (max-width: 720px) { .af-choice { flex-direction: column; align-items: stretch; } .af-mode { flex: 1; justify-content: center; min-height: 48px; } .af-modes > .af-mode { flex: 1 1 0; } }

/* The one-developer note and its support button, at the end of the price section. */
.af-support { margin: 24px 0 0; padding: 16px 24px; border-radius: 16px; background: color-mix(in srgb, var(--accent) 8%, var(--card)); border: 2px solid var(--line); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; }
.af-support p { margin: 0; flex: 1 1 320px; }
@media (max-width: 720px) { .af-support .af-btn { width: 100%; text-align: center; } }

/* ===== Release: downloads, showcase, scripts (2026-10-20) ===== */
.ph { overflow-wrap: anywhere; }

/* Downloads, near the top: three equal cards, one full border all round, no coloured edges. */
.af-dl { margin-top: 56px; padding-bottom: 8px; }
.af-dl .kicker { margin-bottom: 4px; }
.af-dl h2 { margin: 0 0 8px; }
.af-dl-ver { margin: 0 0 8px; color: var(--muted); font-size: 15px; font-weight: 700; }
.af-dlgrid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 18px; align-items: stretch; }
.af-dlcard { background: var(--card); border: 2px solid var(--line); border-radius: 18px; padding: 24px; min-width: 0; display: flex; flex-direction: column; }
.af-dlcard header { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; }
.af-dlcard .sig { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; flex: none; }
.af-dlcard .sig svg { width: 28px; height: 28px; }
.af-dlcard h3 { margin: 0; font-size: 21px; }
.af-dlcard[data-sys="win"] .sig { background: var(--win-t); color: var(--win); }
.af-dlcard[data-sys="lin"] .sig { background: var(--lin-t); color: var(--lin); }
.af-dlcard > p { margin: 0 0 14px; }
.af-dlcard .af-dl-act { margin-top: auto; margin-bottom: 0; padding-top: 4px; }
.af-dlcard .af-btn { display: block; width: 100%; box-sizing: border-box; text-align: center; overflow-wrap: anywhere; }
.af-dlcard .af-btn + .af-btn { margin-top: 10px; }
.af-dlcard .af-dl-note { margin: 10px 0 0; font-size: 14px; color: var(--muted); }
.af-dl-facts { margin: 16px 0 0; display: grid; gap: 12px; }
.af-dl-facts > div { min-width: 0; }
.af-dl-facts dt { font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; margin-bottom: 4px; }
.af-dl-facts dd { margin: 0; min-width: 0; }
.af-dl-facts code { display: block; font: 12.5px/1.5 ui-monospace, "Cascadia Mono", Consolas, monospace; overflow-wrap: anywhere; word-break: break-all;
  background: var(--soft); border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; }
.af-cmd { margin: 0; font: 12.5px/1.6 ui-monospace, "Cascadia Mono", Consolas, monospace; white-space: pre-wrap; overflow-wrap: anywhere;
  background: #1E1E1E; color: #E8EEF2; border-radius: 10px; padding: 10px 12px; }
.af-cmd .p { color: #6FCF9F; }
.af-dl-sums { margin-top: 14px; }
@media (max-width: 980px) { .af-dlgrid { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .af-dlcard { padding: 20px 16px; } }
.af-oldfs { margin-top: 12px; }

/* The showcase: a jump row, then one block per feature, the picture at full width under its words. */
.af-feat-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
.af-feat-nav a { display: inline-flex; align-items: center; min-height: 40px; padding: 6px 16px; border-radius: 999px; border: 2px solid var(--line); background: var(--card);
  color: var(--fg); font-weight: 700; font-size: 15px; text-decoration: none; transition: background .15s, border-color .15s; }
.af-feat-nav a:hover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 10%, var(--card)); }
.af-feat-nav a:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.af-feats { display: grid; gap: 80px; margin-top: 44px; }
.af-feat { scroll-margin-top: 80px; min-width: 0; }
.af-feat-top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 16px 40px; align-items: center; margin-bottom: 24px; }
.af-feat-top header { display: flex; align-items: center; gap: 16px; }
.af-feat-ic { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; flex: none; background: var(--teal-t); color: var(--teal); }
.af-feat-ic svg { width: 28px; height: 28px; }
.af-feat h3 { margin: 0; font-size: 26px; line-height: 1.2; }
.af-feat-txt { min-width: 0; }
.af-feat-txt p { margin: 0 0 10px; }
.af-feat-txt p:last-child { margin-bottom: 0; }
.af-chips { list-style: none; margin: 16px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.af-chips li { margin: 0; }
.af-chips code { display: inline-block; padding: 3px 10px; border-radius: 999px; background: var(--soft); border: 1px solid var(--line); font-size: 13px; }
.af-feat-term { margin: 0; }
.af-feat-term pre { overflow-x: auto; }
@media (max-width: 860px) {
  .af-feat-top { grid-template-columns: minmax(0, 1fr); }
  .af-feats { gap: 56px; }
  .af-feat h3 { font-size: 23px; }
}

/* Names in other scripts: real text, so the browser picks the fonts; no italics, no faux bold. */
.af-scripts-cap { margin: 18px 0 8px; font-size: 14px; color: var(--muted); }
.af-scripts { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; max-width: 860px; }
.af-srow { display: grid; grid-template-columns: 96px minmax(0, 1fr) 24px minmax(0, 2fr); align-items: center; gap: 12px; background: var(--card); border: 2px solid var(--line); border-radius: 16px; padding: 12px 16px; }
.af-lang { font-size: 13px; font-weight: 700; color: var(--muted); }
.af-typed, .af-found { min-width: 0; overflow-wrap: anywhere; unicode-bidi: isolate; font-size: 18px; line-height: 1.4; }
.af-typed { padding: 6px 14px; border-radius: 999px; background: var(--soft); border: 2px solid var(--line); font-weight: 500; }
.af-arr { color: var(--accent); font-weight: 800; text-align: center; }
.af-found { font-weight: 500; }
.af-found mark { background: color-mix(in srgb, var(--accent) 24%, transparent); color: inherit; border-radius: 4px; padding: 0 2px; }
:lang(zh) { font-family: "Microsoft YaHei UI", "Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Noto Sans SC", "Source Han Sans SC", system-ui, sans-serif; }
:lang(ko) { font-family: "Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans CJK KR", "Noto Sans KR", "Source Han Sans K", system-ui, sans-serif; }
:lang(ar) { font-family: "Segoe UI", "Noto Sans Arabic", "Geeza Pro", "Noto Naskh Arabic", system-ui, sans-serif; }
@media (max-width: 680px) {
  .af-srow { grid-template-columns: 24px minmax(0, 1fr); padding: 12px 14px; gap: 8px 6px; }
  .af-lang, .af-typed { grid-column: 1 / -1; }
  .af-typed { justify-self: start; max-width: 100%; }
  .af-typed, .af-found { font-size: 16px; }
}

/* The 'also indexed' line under a filesystem card: indexed and searched, but not in the Instant column. */
.af-indexed { margin: 8px 0 0; color: var(--muted); font-size: 14px; }
.af-race .bar.w-1 { --w: 1.03%; } .af-race .bar.w-6 { --w: 6.69%; } .af-race .bar.w-11 { --w: 11.05%; } .af-race .bar.w-100 { --w: 100%; }
.af-famc .ic.ic-pdf { background: #C23B37; } .af-famc .ic.ic-am { background: #0B7A6C; } .af-famc .ic.ic-af { background: var(--teal); }
.af-sprite { position: absolute; } .mt-30 { margin-top: 30px; }

#install-apt, #install-arch, #install, [id^="dl-"] { scroll-margin-top: 80px; }

/* Older versions, under the download cards (stamp-release.py fills the table) */
.af-older { margin-top: 24px; }
.af-older summary { cursor: pointer; font-weight: 700; padding: 8px 0; }
.af-older-t { width: 100%; border-collapse: collapse; margin-top: 12px; font-size: 14px; }
.af-older-t th { text-align: left; font-size: 12px; font-weight: 700; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; padding: 8px; }
.af-older-t td { padding: 10px 8px; border-top: 2px solid var(--line); vertical-align: top; overflow-wrap: anywhere; }
.af-older-t code { font-size: 12px; color: var(--muted); }