/* Shared product-page presentation. Curated content and native controls stay in HTML. */
/* Atkinson Hyperlegible Next (Braille Institute, OFL; fonts/OFL.txt), the type of lukesteuber.com, Prior work and Downloads.
   Served from this site; Helvetica Neue stands in until it loads. */
@font-face { font-family:"Atkinson Hyperlegible Next"; src:url("fonts/AtkinsonHyperlegibleNext-Regular.ttf") format("truetype"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"Atkinson Hyperlegible Next"; src:url("fonts/AtkinsonHyperlegibleNext-Medium.ttf") format("truetype"); font-weight:500; font-style:normal; font-display:swap; }
@font-face { font-family:"Atkinson Hyperlegible Next"; src:url("fonts/AtkinsonHyperlegibleNext-SemiBold.ttf") format("truetype"); font-weight:600; font-style:normal; font-display:swap; }
@font-face { font-family:"Atkinson Hyperlegible Next"; src:url("fonts/AtkinsonHyperlegibleNext-Bold.ttf") format("truetype"); font-weight:700; font-style:normal; font-display:swap; }
:root { color-scheme: light; --product-paper:#f7f6f1; --product-ink:#151515; --product-muted:#55544f; --product-line:#d9d7cf; --product-link:#1e50c8; --product-hover:#efede6; --product-pad:clamp(1rem,3vw,1.5rem); --product-lip:clamp(14px,1.25vw,26px); }
:root[data-theme="dark"] { color-scheme:dark; --rim:.2; --product-paper:#181a1b; --product-ink:#f3f1e7; --product-muted:#bfbfb2; --product-line:#4c4e49; --product-link:#a3c0ff; --product-hover:#222527; }
html:has(body.downloads-product) { background:var(--product-paper); }
body.downloads-product { --bg:var(--product-paper); --paper:var(--product-paper); --text:var(--product-ink); --ink:var(--product-ink); --muted:var(--product-muted); --line:var(--product-line); --border:var(--product-line); --link:var(--product-link); --cool:var(--product-link); background:var(--product-paper); color:var(--product-ink); margin:0; font:.9375rem/1.5 "Atkinson Hyperlegible Next","Helvetica Neue",Helvetica,Arial,sans-serif; }
.downloads-product *, .downloads-product *::before, .downloads-product *::after { box-sizing:border-box; }
.downloads-product [hidden] { display:none !important; }
.downloads-product a { color:var(--band-link,var(--product-link)); text-underline-offset:.2em; }
.downloads-product :is(a,button,input,select,textarea,summary,[tabindex]):focus-visible { outline:2px solid var(--band-ink,var(--product-ink)); outline-offset:3px; }
.downloads-product :is(button,input,select,textarea) { font:inherit; }
.downloads-product button { cursor:pointer; }
.downloads-product :is(main,main.page,.app-page) { width:100%; max-width:none; min-width:0; padding:0; margin:0; }
.downloads-product :is(.app-page-split,.app-page-main) { display:contents; }
.downloads-product .product-top { position:relative; z-index:20; background:var(--product-paper); }
.downloads-product .product-top > :is(.site-header,.sitehead) { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:4px 24px; width:100%; max-width:64rem; margin:0 auto; padding:10px var(--product-pad); border:0; background:none; color:var(--product-ink); }
.downloads-product .product-top .wordmark { color:var(--product-ink); font-size:1rem; font-weight:700; text-decoration:none; }
.downloads-product .product-top nav { display:flex; flex-wrap:wrap; gap:0 20px; align-items:center; }
.downloads-product .product-top :is(nav>a,.nav-drop-summary) { display:inline-flex; align-items:center; min-height:44px; color:var(--product-ink); font-size:.8125rem; text-decoration:none; }
.downloads-product .product-top .nav-drop-panel { background:var(--product-paper); border:1px solid var(--product-line); border-radius:0; color:var(--product-ink); }
.downloads-product .product-top .nav-drop-panel a { color:var(--product-ink); min-height:44px; }
.downloads-product .product-top .nav-drop-panel a:hover { background:var(--product-hover); }
.downloads-product .product-top > .product-edge { fill:var(--product-paper); }
.downloads-product .product-band { --surface:var(--product-paper); --band-ink:var(--product-ink); --band-muted:var(--product-muted); --band-link:var(--product-link); --text:var(--band-ink); --ink:var(--band-ink); --muted:var(--band-muted); --link:var(--band-link); --paper:var(--surface); --accent:var(--band-link); position:relative; background:var(--surface); color:var(--band-ink); padding:32px 0 36px; }
.downloads-product .product-band[data-paper-tone="sun"] { --surface:#f6c62b; --band-ink:#151515; --band-muted:#373018; --band-link:#151515; }
.downloads-product .product-band[data-paper-tone="blue"] { --surface:#718ed0; --band-ink:#151515; --band-muted:#20283b; --band-link:#151515; }
/* "sage" is the historical tone name for download sections; it renders the site's leaf green. */
.downloads-product .product-band[data-paper-tone="sage"] { --surface:#6db07c; --band-ink:#151515; --band-muted:#0f2a18; --band-link:#151515; }
/* Package pages built on the Saturn shell: its secondary ink, hairlines and stamp accents keep their light values on a
   colored sheet, so version stamps read the same in light and dark. Product pages do not use these tokens. */
.downloads-product:not([data-product-palette="mono"]) .product-band:is([data-paper-tone="sun"],[data-paper-tone="blue"],[data-paper-tone="sage"]) { --ink-soft:#333333; --rule-strong:rgba(17,17,17,.22); --paper-raise:#efede6; --paper-clean:#f7f6f1; --rule:#d9d7cf; }
/* Stamp accents with at least 4.5:1 on their sheet: darker green and blue on yellow, ink on the blue and green sheets,
   and a light green on dark paper, where the Saturn shell has no dark "good" colour. */
.downloads-product:not([data-product-palette="mono"]) .product-band[data-paper-tone="sun"] { --hot:#1e3a8a; --cool:#1f3f6b; --warn:var(--band-ink); --good:#17492a; }
.downloads-product:not([data-product-palette="mono"]) .product-band:is([data-paper-tone="blue"],[data-paper-tone="sage"]) { --hot:var(--band-ink); --cool:var(--band-ink); --warn:var(--band-ink); --good:var(--band-ink); }
:root[data-theme="dark"] .downloads-product .product-band[data-paper-tone="paper"] { --good:#8fd3a8; }
.downloads-product .product-band[data-paper-tone="paper"] { padding-block:28px; }
.downloads-product .product-band + .product-band { padding-top:40px; }
.downloads-product .product-band[data-product-intro] { padding-top:32px; }
.downloads-product .product-wrap { width:100%; max-width:64rem; margin-inline:auto; padding-inline:var(--product-pad); min-width:0; }
/* the torn edge's pale core: white on light paper, a hint on dark */
.product-edge .rim { fill-opacity:var(--rim, .62); }
.downloads-product .product-edge { position:absolute; top:calc(100% - 1px); left:0; width:100%; height:var(--product-lip); fill:var(--surface,var(--product-paper)); filter:drop-shadow(0 2px 2px #0005) drop-shadow(0 7px 9px #0003); pointer-events:none; z-index:3; }
.downloads-product .product-theme { float:right; display:inline-grid; place-items:center; width:44px; height:44px; margin-top:-10px; padding:0; border:0; border-radius:0; background:none; color:var(--band-ink); cursor:pointer; }
.downloads-product .product-theme[hidden] { display:none; }
.downloads-product .product-theme svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.downloads-product .product-wrap > :is(.app-heading,h1,.hero) { clear:both; }
.downloads-product .product-wrap > :first-child { margin-top:0; }
.downloads-product .product-wrap > :last-child { margin-bottom:0; }
.downloads-product .product-wrap > :is(section,.tool,.product-overview,.legacy-downloads) { border:0; margin:0; padding:0; background:none; }
.downloads-product .product-wrap :is(.container,.page,.download-wrapper,.install-wrapper) { width:100%; max-width:none; padding-inline:0; margin-inline:0; }
.downloads-product .product-band :is(h1,h2,h3,h4,dt,strong) { color:var(--band-ink); }
.downloads-product .product-band p { color:var(--band-muted); }
.downloads-product .product-band :is(.app-lede,.source-note,.requirements,.release-note,.section-intro,.small,.caption,.header-explain,.hero-copy>p,.steps p,.feature-grid li,.features p) { color:var(--band-muted); }
.downloads-product .product-band :is(.back,.back a) { font-size:.8125rem; margin-block:0 18px; min-height:44px; display:inline-flex; align-items:center; }
.downloads-product .product-band h1 { font:700 clamp(2rem,5vw,3rem)/1.06 "Atkinson Hyperlegible Next","Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:-.045em; margin:0 0 16px; overflow-wrap:anywhere; }
.downloads-product .product-band h2 { font-size:clamp(1.35rem,3vw,1.65rem); line-height:1.2; letter-spacing:-.025em; margin:0 0 16px; }
.downloads-product .product-band h3 { font-size:1.0625rem; line-height:1.3; margin:0 0 8px; }
.downloads-product .product-band :is(.app-lede,.tagline,.intro>p) { max-width:72ch; font-size:1.0625rem; line-height:1.5; margin:0 0 16px; letter-spacing:0; }
.downloads-product .product-band :is(p,li,dd) { overflow-wrap:anywhere; }
.downloads-product .product-band p { max-width:80ch; margin:0 0 16px; }
.downloads-product .product-band :is(ul,ol) { max-width:80ch; padding-left:1.4rem; }
.downloads-product .product-band li { margin-bottom:.6rem; }
.downloads-product .app-heading { display:flex; align-items:center; flex-wrap:nowrap; gap:16px; margin-bottom:16px; }
.downloads-product .app-heading .app-icon { width:56px; height:56px; flex:0 0 56px; border-radius:22%; object-fit:contain; }
.downloads-product .app-heading h1 { margin:0; }
.downloads-product .product-band :is(.download-actions,.downloads,.download-grid) { display:flex; flex-wrap:wrap; align-items:center; justify-content:flex-start; gap:8px 24px; max-width:none; margin:12px 0 16px; padding:0; }
.downloads-product .product-band :is(.download-link,.download-link.primary,.btn,.download-btn) { display:inline-flex; align-items:center; justify-content:flex-start; min-height:44px; max-width:100%; margin:0; padding:8px 0; border:0; border-radius:0; background:none; box-shadow:none; color:var(--band-link); font:600 .875rem/1.4 "Atkinson Hyperlegible Next","Helvetica Neue",Helvetica,Arial,sans-serif; letter-spacing:0; text-transform:none; text-decoration:underline; white-space:normal; }
.downloads-product .product-band :is(.download-link,.btn,.download-btn):hover { background:none; box-shadow:none; color:var(--band-link); text-decoration-thickness:2px; transform:none; }
.downloads-product .product-band :is(.android-install-note,.requirements,.voice-panel,.story-preview,.screen-mat,.download-card) { padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.downloads-product .product-band .android-install-note { font-size:.875rem; margin-block:16px; }
.downloads-product .product-band .requirements { margin-block:16px; }
.downloads-product .product-band details { border:0; border-top:1px solid var(--product-line); border-radius:0; background:none; margin:0; padding:8px 0; }
.downloads-product .product-band summary { cursor:pointer; min-height:48px; padding:10px 0; font-size:.9375rem; font-weight:600; color:var(--band-ink); }
.downloads-product .product-band details p { margin-block:10px; }
.downloads-product .product-band :is(.app-meta,.product-meta,.release-note,.source-note,.small) { font-size:.8125rem; }
.downloads-product .product-band .product-meta a { display:inline-flex; align-items:center; min-height:44px; }
.downloads-product .product-band :is(.feature-grid,.features) { display:block; padding:0; list-style:none; max-width:none; }
.downloads-product .product-band :is(.feature-grid li,.feature) { display:block; border:0; border-bottom:1px solid var(--product-line); padding:14px 0; margin:0; background:none; box-shadow:none; border-radius:0; }
.downloads-product .product-band .feature-icon { float:left; margin:0 14px 0 0; }
.downloads-product .product-band .feature-grid strong { display:block; margin-bottom:4px; }
.downloads-product .product-band .service-list { display:flex; flex-wrap:wrap; gap:0 20px; padding:0; list-style:none; }
.downloads-product .product-band .service-list li { padding:4px 0; border:0; border-radius:0; }
.downloads-product .product-band :is(.web-preview,.app-promo-rail figure) { width:100%; max-width:none; margin:0; }
.downloads-product .product-band :is(.web-preview-link,.app-promo-rail) { display:block; position:static; min-width:0; max-width:none; margin:0; padding:0; border:0; border-radius:0; background:none; box-shadow:none; }
.downloads-product .product-band :is(.web-preview img,.web-preview video,.demo-video,.app-promo-rail video) { display:block; width:auto; height:auto; max-width:100%; max-height:24rem; object-fit:contain; border:0; border-radius:0; background:none; box-shadow:none; }
.downloads-product .product-band .web-preview-link img { opacity:1; transition:none; }
.downloads-product .product-band .web-preview-link:hover img { opacity:1; box-shadow:none; }
.downloads-product .product-band :is(.demo-gallery,.shots,.screenshots) { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr)); gap:24px; width:100%; max-width:none; margin:0; }
.downloads-product .product-band :is(.demo-gallery figure,.shots figure,.screenshot) { min-width:0; margin:0; background:none; border:0; border-radius:0; padding:0; box-shadow:none; }
.downloads-product .product-band :is(.demo-gallery img,.shots img,.screenshot img) { max-width:100%; max-height:24rem; width:auto; height:auto; object-fit:contain; border:0; border-radius:0; box-shadow:none; }
.downloads-product .product-band figcaption { color:var(--band-muted); font-size:.8125rem; line-height:1.45; margin-top:10px; }
.downloads-product .product-band figcaption strong { color:var(--band-ink); }
.downloads-product .product-band :is(img,video) { max-width:100%; height:auto; }
.downloads-product .product-band iframe { max-width:100%; }
.downloads-product .product-band :is(code,pre) { overflow-wrap:anywhere; white-space:pre-wrap; }
.downloads-product .product-band table { display:block; width:100%; max-width:100%; overflow-x:auto; border-collapse:collapse; color:var(--band-ink); }
.downloads-product .product-band :is(th,td) { border-bottom:1px solid var(--product-line); padding:10px; }
.downloads-product .product-band .recal-head { background:none; padding:0; }
.downloads-product .product-band .recal-head-grid { max-width:none; }
.downloads-product .product-band .font-tester-wrapper { max-width:none; }
.downloads-product .product-band .font-tester { border:1px solid var(--product-line); border-radius:0; background:var(--product-paper); color:var(--product-ink); box-shadow:none; }
.downloads-product .font-tester :is(.demo-label,.font-controls) { color:var(--product-muted); }
.downloads-product .font-tester .demo-text { color:var(--product-ink); }
.downloads-product .product-band :is(.font-btn,.browser-tab) { border:0; border-radius:0; min-height:44px; background:none; color:var(--band-ink); }
.downloads-product .product-band :is(.font-btn.active,.browser-tab.active,[role="tab"][aria-selected="true"]) { text-decoration:underline; text-underline-offset:.3em; font-weight:700; }
.downloads-product .product-band .install-step { border:0; border-bottom:1px solid var(--product-line); border-radius:0; background:none; box-shadow:none; }
.downloads-product .product-band .step-number { background:none; color:var(--band-ink); border-radius:0; }
.downloads-product .product-band .download-card { min-width:0; flex:1 1 240px; }
.downloads-product .product-band .download-card h2 svg { color:var(--band-ink); }
.downloads-product .product-band .download-card p { color:var(--band-muted); }
.downloads-product :is(footer,footer.sitefoot,.site-footer) { width:100%; max-width:64rem; margin:0 auto; padding:24px var(--product-pad); border:0; background:none; color:var(--product-muted); font-size:.8125rem; }
.downloads-product footer a { display:inline-flex; align-items:center; min-height:44px; color:var(--product-link); }
.downloads-product .skip-link { z-index:100; background:var(--product-ink); color:var(--product-paper); }
.downloads-product.high-contrast { --product-paper:#fff; --product-ink:#000; --product-muted:#222; --product-line:#222; --product-link:#073f9c; }
.downloads-product.high-contrast .product-band { --surface:var(--product-paper); --band-ink:var(--product-ink); --band-muted:var(--product-muted); --band-link:var(--product-link); }
/* Neutral page chrome for color-vision tools; original media colors stay intact. */
:root:has(body.downloads-product[data-product-palette="mono"]) { --product-paper:#f7f7f7; --product-ink:#151515; --product-muted:#555; --product-line:#d7d7d7; --product-link:#151515; --product-hover:#ededed; --product-sheet:#e5e5e5; }
:root[data-theme="dark"]:has(body.downloads-product[data-product-palette="mono"]) { --product-paper:#191919; --product-ink:#f2f2f2; --product-muted:#bfbfbf; --product-line:#4c4c4c; --product-link:#f2f2f2; --product-hover:#252525; --product-sheet:#2a2a2a; }
.downloads-product[data-product-palette="mono"] .product-band[data-paper-tone] { --surface:var(--product-paper); --band-ink:var(--product-ink); --band-muted:var(--product-muted); --band-link:var(--product-link); }
.downloads-product[data-product-palette="mono"] .product-band:is([data-paper-tone="sun"],[data-paper-tone="blue"],[data-paper-tone="sage"]) { --surface:var(--product-sheet); }
@media (max-width:48em) {
  .downloads-product .product-top nav { gap:0 16px; }
  .downloads-product .product-band { padding-block:28px; }
  .downloads-product .product-band + .product-band { padding-top:36px; }
  .downloads-product .product-band :is(.app-lede,.tagline,.intro>p) { font-size:1rem; }
  .downloads-product .app-heading { gap:12px; }
  .downloads-product .app-heading .app-icon { width:44px; height:44px; flex-basis:44px; }
  .downloads-product .product-band :is(.hero,.tether .hero,.recal-head-grid,.instructions-grid,.install-grid) { grid-template-columns:minmax(0,1fr); }
  .downloads-product .product-band :is(.hero-art,.story-preview) { max-width:100%; }
  .downloads-product .product-band .screenshots { overflow:visible; }
  .downloads-product .product-band :is(.download-actions,.downloads,.download-grid) { gap:4px 20px; }
  .downloads-product .product-band :is(input,select,textarea) { max-width:100%; font-size:1rem; }
  .downloads-product .product-band .screens { grid-template-columns:minmax(0,1fr); }
}
@media (prefers-reduced-motion:reduce) {
  .downloads-product *, .downloads-product *::before, .downloads-product *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}
@media (forced-colors:active) {
  .downloads-product .product-edge { display:none; }
  .downloads-product .product-band,
  .downloads-product[data-product-palette="mono"] .product-band[data-paper-tone] { --surface:Canvas; --band-ink:CanvasText; --band-muted:CanvasText; --band-link:LinkText; border-bottom:1px solid CanvasText; }
  .downloads-product :is(a,button,input,select,summary):focus-visible { outline-color:Highlight; }
}

.downloads-product .footer-sep { color:var(--product-muted); }
.downloads-product .product-band .hero { padding:0; margin:0; }
.downloads-product.tether .product-band .hero-copy > p:not(.eyebrow):not(.tagline):not(.release-note) { color:var(--band-muted); font-size:1rem; line-height:1.5; }
.downloads-product .product-band .story-facts { color:var(--band-muted); }
.downloads-product .product-band .recal-wordmark .re { color:#b3261e; }
.downloads-product .product-band .nav-badges { display:flex; flex-wrap:wrap; gap:0 24px; }
.downloads-product .product-band .nav-badge { min-height:44px; padding:0; border:0; border-radius:0; background:none; color:var(--band-link); box-shadow:none; }
.downloads-product .product-band .font-button { min-height:44px; border:1px solid var(--product-line); border-radius:0; background:var(--product-paper); color:var(--product-ink); }
.downloads-product .product-band .font-button.active { background:var(--product-ink); color:var(--product-paper); }
.downloads-product .product-band:has(> .product-wrap > .download-section-mobile) { display:none; }
@media (max-width:48em) {
  .downloads-product .product-top nav { gap:0 12px; }
  .downloads-product .product-top :is(nav>a,.nav-drop-summary) { font-size:.75rem; }
  .downloads-product .product-band:has(> .product-wrap > .download-section-mobile) { display:block; }
  .downloads-product .product-band:has(> .product-wrap > .download-section-desktop) { display:none; }
}
.downloads-product .product-band .screenshots-container { overflow:visible; width:100%; max-width:none; }
.downloads-product .product-band .screenshot { overflow:visible; aspect-ratio:auto; width:auto; max-width:100%; }
.downloads-product .product-band :is(.download-wrapper,.install-wrapper) { background:none; border:0; border-radius:0; box-shadow:none; padding:0; }
.downloads-product .product-band .header-screenshot { border-radius:0; box-shadow:none; }
.downloads-product .product-band :is(.features,.instructions) { background:none; border:0; border-radius:0; box-shadow:none; padding:0; }
/* Legacy extension tokens follow the explicit Downloads appearance as well. */
:root:has(body.downloads-product):not([data-theme="dark"]) { color-scheme:light; }
body.downloads-product { color-scheme:inherit; --paper-clean:var(--product-paper); --paper-raise:var(--product-hover); --rule:var(--product-line); --rule-strong:var(--product-line); --hot:#b3261e; --hot-wash:rgba(179,38,30,.08); }
:root[data-theme="dark"] body.downloads-product { --hot:#ff9b91; --hot-wash:rgba(255,155,145,.1); }

/* Screenshots: one row of prints that scrolls sideways; the row takes focus so a keyboard can scroll it. */
/* It runs out to the window's right edge, so the next screenshot shows there. */
.downloads-product .product-band .app-shots { list-style:none; display:flex; gap:clamp(12px,2vw,20px); max-width:none; margin:0 calc(50% - 50vw) 0 0; padding:4px var(--product-pad) 16px 4px; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; scrollbar-width:thin; }
.downloads-product .app-shots li { flex:none; margin:0; scroll-snap-align:start; }
.downloads-product .app-shots img { display:block; width:auto; max-width:none; height:clamp(280px,48vh,460px); background:var(--product-paper); box-shadow:0 2px 3px rgba(0,0,0,.3),0 8px 14px -6px rgba(0,0,0,.3); }
.downloads-product .app-shots:focus-visible { outline:2px solid var(--product-ink); outline-offset:4px; }
/* the versions now offered, under the download buttons */
.downloads-product .product-band .app-version { margin:0 0 8px; font-size:.875rem; color:var(--band-muted); }
