@font-face{font-family:"et-book";src:url("/fonts/et-book-roman-old-style-figures/et-book-roman-old-style-figures.woff") format("woff");font-weight:normal;font-style:normal;font-display:swap}
@font-face{font-family:"et-book";src:url("/fonts/et-book-display-italic-old-style-figures/et-book-display-italic-old-style-figures.woff") format("woff");font-weight:normal;font-style:italic;font-display:swap}
@font-face{font-family:"et-book";src:url("/fonts/et-book-bold-line-figures/et-book-bold-line-figures.woff") format("woff");font-weight:bold;font-style:normal;font-display:swap}
/* pass 9: ET Book has Latin only. Greek, Arabic, Hebrew and Devanagari come from a local serif of the same weight through
   unicode-range faces of the same family, so Latin text keeps ET Book and its fallbacks */
@font-face{font-family:"et-book";src:local("Noto Serif"),local("NotoSerif-Regular"),local("Times New Roman"),local("TimesNewRomanPSMT"),local("Georgia"),local("DejaVu Serif");font-style:normal;font-weight:normal;unicode-range:U+0370-03FF,U+1F00-1FFF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Serif Italic"),local("NotoSerif-Italic"),local("Times New Roman Italic"),local("TimesNewRomanPS-ItalicMT"),local("Georgia Italic"),local("Georgia-Italic"),local("DejaVu Serif Italic"),local("Noto Serif"),local("NotoSerif-Regular"),local("Times New Roman"),local("TimesNewRomanPSMT"),local("Georgia"),local("DejaVu Serif");font-style:italic;font-weight:normal;unicode-range:U+0370-03FF,U+1F00-1FFF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Naskh Arabic"),local("NotoNaskhArabic-Regular"),local("Geeza Pro"),local("GeezaPro"),local("Al Nile"),local("Arial");font-style:normal;font-weight:normal;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Naskh Arabic"),local("NotoNaskhArabic-Regular"),local("Geeza Pro"),local("GeezaPro"),local("Al Nile"),local("Arial");font-style:italic;font-weight:normal;unicode-range:U+0600-06FF,U+0750-077F,U+08A0-08FF,U+FB50-FDFF,U+FE70-FEFF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Serif Devanagari"),local("NotoSerifDevanagari-Regular"),local("Kohinoor Devanagari"),local("KohinoorDevanagari-Regular"),local("Devanagari Sangam MN"),local("ITF Devanagari");font-style:normal;font-weight:normal;unicode-range:U+0900-097F,U+A8E0-A8FF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Serif Devanagari"),local("NotoSerifDevanagari-Regular"),local("Kohinoor Devanagari"),local("KohinoorDevanagari-Regular"),local("Devanagari Sangam MN"),local("ITF Devanagari");font-style:italic;font-weight:normal;unicode-range:U+0900-097F,U+A8E0-A8FF;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Serif Hebrew"),local("Times New Roman"),local("Arial Hebrew"),local("ArialHebrew"),local("Arial");font-style:normal;font-weight:normal;unicode-range:U+0590-05FF,U+FB1D-FB4F;font-display:swap}
@font-face{font-family:"et-book";src:local("Noto Serif Hebrew"),local("Times New Roman"),local("Arial Hebrew"),local("ArialHebrew"),local("Arial");font-style:italic;font-weight:normal;unicode-range:U+0590-05FF,U+FB1D-FB4F;font-display:swap}
:root{--paper:#fffff8;--ink:#111;--soft:#5f5b53;--faint:#8c877c;--rule:#d8d3c4;--hair:#bdb7a8;--red:#a1262a;--measure:36rem;--fs-hint:.85rem;--fs-label:1rem;--fs-form:1.25rem;--fs-body:1.4rem;--fs-head:1.55rem;--fs-title:2.6rem;--fs-display:clamp(3.6rem,8.5vw,6.4rem);--ls-sc:.07em;--lh-label:1.2}
@media (prefers-color-scheme:dark){:root{--paper:#151513;--ink:#ebe8de;--soft:#aaa597;--faint:#7c786e;--rule:#3a3832;--hair:#5a564d;--red:#e2816d}}
*{box-sizing:border-box}
html{font-size:15px;-webkit-text-size-adjust:100%}
body{margin:0 auto;max-width:1240px;padding:2rem 4.5% 4rem 8%;background:var(--paper);color:var(--ink);font-family:et-book,Palatino,"Palatino Linotype","Book Antiqua",Georgia,"Noto Serif","Noto Naskh Arabic","Noto Serif Devanagari",serif;font-size:var(--fs-body);line-height:1.5;font-variant-numeric:oldstyle-nums;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none;background:linear-gradient(var(--hair),var(--hair)) 0 92%/100% 1px no-repeat}
a:hover,a:focus-visible{background-image:linear-gradient(var(--ink),var(--ink))}
:focus-visible{outline:1px dotted var(--soft);outline-offset:3px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--soft)}
h2{font-weight:normal;font-style:italic;font-size:var(--fs-head);margin:2.8rem 0 .6rem;line-height:1.2}
h3{font-weight:normal;font-size:var(--fs-form);margin:1.2rem 0 .3rem}
.n-lang,.st-lang,.sc,.t-n .t-lang{font-variant:small-caps;font-variant-caps:all-small-caps;letter-spacing:var(--ls-sc);color:var(--soft)}
.rubric{color:var(--red)}
/* masthead + search */
.masthead{display:flex;align-items:baseline;gap:2.2rem;margin-bottom:2.4rem;flex-wrap:wrap}
.brand,.brand:hover,.brand:focus-visible{font-size:var(--fs-head);letter-spacing:.09em;font-variant-caps:all-small-caps;background:none}   /* QA r3 #1: the link-underline gradient must not fill the wordmark; focus keeps the dotted outline */
#search{position:relative;flex:0 1 22rem}
#q{width:100%;font:inherit;font-size:var(--fs-form);border:0;border-bottom:1px solid var(--hair);background:transparent;color:inherit;padding:.15rem 0;border-radius:0;-webkit-appearance:none;appearance:none}
#q:focus{outline:none;border-bottom-color:var(--ink)}
#q:focus-visible{outline:1px dotted var(--soft);outline-offset:3px}   /* QA r3 #4: the dotted outline every other focus stop has */
#q::placeholder{color:var(--soft);font-style:italic}
#q::-webkit-search-cancel-button{display:none}
#suggest{list-style:none;margin:0;padding:.3rem 0;position:absolute;left:0;right:0;top:100%;background:var(--paper);z-index:20;border-bottom:1px solid var(--hair)}
#suggest li{padding:.12rem 0;cursor:pointer;font-size:var(--fs-form)}
#suggest li.on,#suggest li:hover{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
#suggest li.fz{font-style:italic;color:var(--soft);cursor:default;font-size:var(--fs-label)}
/* stage */
.rw{position:relative}
.rw-sticky{background:var(--paper);padding-bottom:.6rem}

.stage{min-height:13.5rem}
.st-top{margin:0;height:1.6rem;font-size:var(--fs-label);color:var(--soft)}
.st-st,.st-per{font-size:var(--fs-label);color:var(--soft)}
.st-st:not(:empty)::before{content:"· "}
.st-per:not(:empty)::before{content:"· "}
.hw{font-weight:normal;font-size:var(--fs-display);line-height:1.05;margin:0;letter-spacing:-.005em;white-space:nowrap}
.hw-form{position:relative;display:inline-block}
.hw-form .ch{display:inline-block;white-space:pre}
.hw-form .ghost{position:absolute;pointer-events:none}
.hw-form.rec{font-style:italic}
.hw-form.rubric{color:var(--red)}
.st-gloss{margin:.15rem 0 0;font-size:var(--fs-head);color:var(--soft);min-height:2.2rem;max-width:var(--measure)}
.answer{max-width:var(--measure);margin:.6rem 0 1.4rem;font-size:var(--fs-form)}
.hint{margin:.4rem 0 0;font-size:var(--fs-label);color:var(--soft);font-style:italic;transition:opacity .4s}
.hint.gone{opacity:0}
kbd{font-family:inherit;font-style:normal}
/* bloom */
.bloom{height:0;overflow:visible;position:relative}
.bloom .bl-cap{margin:.2rem 0 0;font-size:var(--fs-label);font-style:italic;color:var(--soft);opacity:0;transition:opacity .4s}
.bloom ul{list-style:none;margin:.1rem 0 0;padding:0;display:flex;flex-wrap:wrap;gap:.2rem 1.1rem}
.bloom li{font-size:var(--fs-form);font-style:italic;opacity:0;transform:translateX(calc(var(--j) * -1.6rem)) translateY(-.6rem);transition:opacity .45s ease-out,transform .55s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--j) * 55ms)}
.bloom.open .bl-cap{opacity:1}
.bloom.open li{opacity:1;transform:none}
.rw.at-root .stage{min-height:17rem}
/* time-depth hairline */
.axis{position:relative;height:3.4rem;margin:.4rem 0 .6rem}
.ax-line{position:absolute;left:0;right:0;top:1.6rem;border-top:1px solid var(--hair)}
.ax-tick{position:absolute;top:1.6rem;height:.35rem;border-left:1px solid var(--hair)}
.ax-tick span{position:absolute;top:.45rem;left:0;transform:translateX(-50%);font-size:var(--fs-hint);color:var(--soft);white-space:nowrap}
.ax-tick small{font-size:var(--fs-hint);letter-spacing:.05em}
.ax-range{position:absolute;top:calc(1.6rem - 1px);height:3px;background:var(--rule);transition:background .3s}
.ax-range.on{background:var(--hair)}
.ax-node{position:absolute;top:1.6rem;width:7px;height:7px;margin:-3px 0 0 -3.5px;border-radius:50%;background:var(--ink);transition:transform .3s}
.ax-node.rec{background:var(--paper);border:1px dotted var(--ink)}
.ax-node.root{background:var(--red);border-color:var(--red)}
.ax-node.on{transform:scale(1.7)}
.ax-label{position:absolute;top:0;font-size:var(--fs-hint);color:var(--ink);white-space:nowrap;transform:translateX(-.3rem);transition:left .45s cubic-bezier(.4,0,.2,1)}
.ax-label.flip{transform:translateX(calc(-100% + .3rem))}
/* chain (desktop: oldest at the left) */
.chain{list-style:none;margin:0;padding:0}
.chain.desk{display:flex;align-items:flex-start}
/* QA-1 #23: the "Another origin" chain (.chain.mini) had no rules, so its dots sat at the page's top-left corner */
.chain.mini{margin:0 0 1.2rem}
.chain.mini .node{position:relative;padding:0 0 .9rem 1.6rem;font-size:var(--fs-label)}
.chain.mini .link{display:none}
.chain.mini .node::before{content:"";position:absolute;left:4px;top:1.1rem;bottom:-.2rem;border-left:1px solid var(--soft)}
.chain.mini .node.here::before{display:none}
.chain.mini .node .n-dot{top:.75rem}
.chain.mini .node.root .n-dot{background:var(--ink)}
.chain.mini .node.root.reconstructed .n-dot{background:var(--paper);border:1.5px dotted var(--ink)}
.chain.mini .node.root .n-form{color:inherit}
.chain.desk .node{flex:1 1 0;min-width:0;position:relative;padding:1.1rem .5rem 0 0;font-size:var(--fs-label);line-height:1.3;cursor:pointer;transition:opacity .35s}
.chain.desk .link{flex:0 0 1.4rem;margin-top:calc(.55rem);border-top:1px solid var(--soft)}
.chain.desk .link.dot{border-top-style:dotted;border-top-width:2px;border-top-color:var(--soft)}
.chain.desk .link.unc{position:relative}
.chain.desk .link.unc::after{content:"?";position:absolute;top:-1.15rem;left:50%;transform:translateX(-50%);font-size:var(--fs-hint);color:var(--soft)}
.node .n-dot{position:absolute;left:0;top:.55rem;width:9px;height:9px;margin-top:-4.5px;border-radius:50%;background:var(--ink)}
.node.reconstructed .n-dot{background:var(--paper);border:1.5px dotted var(--ink)}
.node.root .n-dot{background:var(--red);border:0}
.node.root.reconstructed .n-dot{background:var(--paper);border:1.5px dotted var(--red)}
.node .n-lang{display:block;font-size:var(--fs-hint);line-height:var(--lh-label)}
.node .n-per{display:block;font-size:var(--fs-hint);color:var(--soft);line-height:1.2;margin-bottom:.2rem}
.node .n-form{display:block;font-style:italic;font-size:var(--fs-form);line-height:var(--lh-label);overflow-wrap:anywhere}
.node.root .n-form{color:var(--red)}
.node.here .n-form{font-style:normal}
.node .n-tr{display:block;font-size:var(--fs-hint);color:var(--soft);font-style:italic}
.node .n-gloss{display:block;font-size:var(--fs-label);margin-top:.15rem}
.node .n-lit{display:block;font-size:var(--fs-hint);color:var(--soft);font-style:italic}
.node .n-st{display:block;font-size:var(--fs-hint);color:var(--soft);margin-top:.25rem;font-variant-caps:all-small-caps;letter-spacing:.06em}
.node.uncertain .n-st,.node.disputed .n-st{color:var(--ink)}
.node .n-via{display:none}
.rw.rewinding .chain.desk .node{opacity:.55}
.rw.rewinding .chain.desk .node.on{opacity:1}
.rw.rewinding .chain.desk .node.root{opacity:1}
.legend{font-size:var(--fs-hint);color:var(--soft);margin:.9rem 0 0}
.lg{display:inline-block;width:1.3rem;vertical-align:middle;margin:0 .25rem 0 .7rem;border-top:1px solid var(--soft)}
.lg:first-child{margin-left:0}
.lg.dot{border-top:2px dotted var(--soft)}
.lg.unc{border:0;width:auto;font-size:var(--fs-hint)}
.lg.root{width:9px;height:9px;border:0;border-radius:50%;background:var(--red)}
.rw-run{pointer-events:none}
.mobchain{display:none}
/* compound */
.compound{max-width:52rem;margin:1.6rem 0}
.cp-head{margin:0 0 .4rem}
.cp-cols{display:flex;gap:3rem}
.cp-col{border-left:1px solid var(--rule);padding-left:1rem}
.cp-n{margin:.1rem 0;font-size:var(--fs-label)}
/* QA-1 #23: one accent, used once: a part's oldest step in a compound column is not the word's root, so it stays ink */
/* story with sidenotes */
.story,.storyline,.other,.today,.sources,.fa,.rootlink{max-width:var(--measure)}
.story p,.other p{margin:0 0 1rem}
.storyline p{font-size:var(--fs-body);margin:1.6rem 0 0}
.fa{font-size:var(--fs-label);margin:1.2rem 0 0}
.contested-s{text-decoration:underline dotted var(--soft);text-decoration-thickness:1px;text-underline-offset:4px}
.sn-ref{cursor:pointer;font-size:var(--fs-hint);vertical-align:super;line-height:0;margin-left:.1rem;color:var(--soft)}
.sn-toggle{display:none}
.sidenote{float:right;clear:right;margin-right:calc(-1 * (100vw - var(--measure)) * .32);width:16rem;margin-top:.3rem;margin-bottom:1rem;font-size:var(--fs-label);line-height:1.35;color:var(--soft);position:relative}
.sidenote::before{content:attr(data-n)}
.sn-kind{display:block;font-variant-caps:all-small-caps;letter-spacing:.07em;color:var(--ink)}
@media (min-width:1240px){.sidenote{margin-right:-20rem}}
.sec-lede{color:var(--soft);font-size:var(--fs-label);margin:0 0 .6rem;max-width:var(--measure)}
.path{font-size:var(--fs-label);color:var(--soft);font-style:italic}
.more{font-size:var(--fs-label);color:var(--soft)}
.rootlink{font-size:var(--fs-form);margin-top:1.4rem}
.today p,.sources p{font-size:var(--fs-label)}
.today .pos{font-style:italic;color:var(--soft)}
.sources p{color:var(--soft)}
.pernote{max-width:var(--measure);font-size:var(--fs-label);color:var(--soft);margin-top:2.4rem}   /* v0.1.9: the note that stayed when the per-word credit went */
/* home */
.lede{font-size:var(--fs-head);max-width:var(--measure);margin-top:0}
.home .lede{font-size:var(--fs-form);color:var(--soft)}
.samples a{margin-right:1rem;font-style:italic;font-size:var(--fs-body);line-height:1.9}
.foot{margin-top:5rem;max-width:var(--measure);font-size:var(--fs-label);color:var(--soft)}
.loading{font-style:italic}
.nearlist{list-style:none;padding:0;columns:2}
.rootlist{list-style:none;padding:0;columns:2 18rem;column-gap:3rem;font-size:var(--fs-form)}
/* ---------- small screens: the chain runs downward, oldest first ---------- */
@media (max-width:760px){
  body{padding:1.2rem 5.5% 3rem}
  .masthead{gap:.6rem 1.4rem;margin-bottom:1.4rem}
  #search{flex:1 1 100%}
  .stage{min-height:11rem}
  :root{--fs-display:clamp(2.8rem,13vw,4rem)}
  .st-gloss{font-size:var(--fs-form)}
  .chain.desk,.legend{display:none}
  .mobchain{display:block}
  .mobchain h2{margin-top:1.4rem}
  .chain.mob .node{position:relative;padding:0 0 1rem 1.6rem;cursor:pointer;font-size:var(--fs-label)}
  .chain.mob .link{display:none}
  .chain.mob .node::before{content:"";position:absolute;left:4px;top:1.1rem;bottom:-.2rem;border-left:1px solid var(--soft)}
  .chain.mob .node.here::before{display:none}
  .chain.mob .node .n-dot{top:.75rem}
  .chain.mob .node.on .n-form{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
  .sidenote{display:none}
  .sn-toggle:checked+.sidenote{display:block;float:none;margin:.5rem 0 .8rem 1rem;width:auto}
  .cp-cols{flex-direction:column;gap:1rem}
  .axis{margin-top:.2rem}
  .ax-tick:nth-child(even) span{display:none}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}.bloom{height:auto}.bloom li,.bloom .bl-cap{opacity:1;transform:none}}
/* unlock */
.hw-sm{font-size:var(--fs-title);font-weight:400;margin:0 0 .4rem}
.unlock{max-width:var(--measure)}
.unlock-form{margin:1.4rem 0 .6rem;display:flex;gap:1rem;align-items:baseline;flex-wrap:wrap}
.unlock-form label{font-variant-caps:all-small-caps;letter-spacing:.07em;color:var(--soft)}
.unlock-form input{font:inherit;font-size:var(--fs-form);letter-spacing:.06em;background:none;color:var(--ink);border:0;border-bottom:1px solid var(--soft);padding:.1rem 0;width:min(17.5rem,100%);font-size:var(--fs-form);letter-spacing:.04em;text-transform:uppercase}
.unlock-form input:focus{outline:none;border-bottom-color:var(--ink)}
.unlock-form button{background:none;border:0;padding:0;cursor:pointer;font-family:inherit}
.unlock-msg{min-height:1.4em;font-style:italic}
.unlock-form button{font-size:var(--fs-label);color:var(--ink);border-bottom:1px solid var(--rule)}
/* FOUNDING: the founding mark (badge mode), a quiet line under the credits, set off by one hairline */
.fstate{font-style:italic}
.foot .fmark{margin-top:1.2rem;padding-top:.6rem;border-top:1px solid var(--rule);width:12rem}
.foot .fmark a{color:var(--soft);text-decoration:none}
.foot .fmark .sc{color:var(--soft)}

/* ---------- pass 2 ---------- */
@font-face{font-family:"Pinyon Script";src:url("/fonts/pinyon-script/pinyon-script-ash.woff2") format("woff2");font-weight:normal;font-style:normal;unicode-range:U+41,U+68,U+73;font-display:swap}   /* #46: Ash's signature; subset to A, s, h (OFL, fonts/PinyonScript-OFL.txt) */
@font-face{font-family:"Noto Sans Runic";src:url(/fonts/NotoSansRunic-Regular.ttf) format("truetype");unicode-range:U+16A0-16FF;font-display:swap}
.runic{font-family:"Noto Sans Runic",sans-serif;font-style:normal;font-size:var(--fs-form);color:var(--ink)}
.stage{min-height:0}
.st-gloss{min-height:1.9rem}
.hint{margin:0}
.under{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-top:.9rem}
.under .legend{margin:0}
/* nodes: no connector stubs; the dot style carries the status */
.chain.desk .node{padding-right:.9rem}
.node.uncertain .n-dot,.node.disputed .n-dot{background:var(--paper);border:1.5px solid var(--ink)}
.node.gap .n-dot{background:var(--paper);border:1.5px dashed var(--red)}
.lg{border-top:0;width:9px;height:9px;border-radius:50%;margin:0 .3rem 0 .9rem}
.lg.att{background:var(--soft)}
.lg.rec{border:1.5px dotted var(--soft);background:none}
.lg.unc{width:auto;height:auto;border-radius:0;background:none}
.node .n-rt{display:block;font-size:var(--fs-hint);color:var(--soft);margin-top:.25rem;line-height:1.25}
.chain.desk .sidenote{display:none;float:none;position:absolute;z-index:3;left:0;top:100%;width:15rem;margin:.2rem 0 0;padding:.4rem 0;background:var(--paper);font-style:normal}
.chain.desk .sn-toggle:checked+.sidenote{display:block}
.chain.desk .sn-ref{font-size:var(--fs-hint)}
.eq{max-width:var(--measure);margin:.9rem 0 0;font-size:var(--fs-hint);line-height:1.45;color:var(--soft)}   /* v0.1.10: the earliest quotation, on its own line under the lineage (the step citations are gone) */
.story{margin-top:2.2rem}
@media (max-width:760px){
  .chain.mob .sidenote{display:none}
  .chain.mob .sn-toggle:checked+.sidenote{display:block;float:none;margin:.3rem 0 .5rem;width:auto;font-size:var(--fs-label)}
}
/* pass 2: SEO intro, myth and root pages, 404 */
.crumb .sep{color:var(--hair);margin:0 .4em}
.seo-intro{color:var(--soft);font-size:var(--fs-label);margin:.2rem 0 .4rem;max-width:40rem}
.myth .kicker{font-variant-caps:all-small-caps;letter-spacing:.09em;color:var(--soft);margin:0}
.myth h2,.rootpage h2{font-weight:400;font-style:italic;font-size:var(--fs-body);margin:2rem 0 .4rem}
.myth-q{margin:0;padding-left:1rem;border-left:1px solid var(--hair);max-width:40rem}
.rootpage ul.members{columns:3 11rem;padding:0;list-style:none}
.rootpage ul.members li{break-inside:avoid;padding:.1rem 0}
.crumb{font-size:var(--fs-label);color:var(--soft);margin:2rem 0 0}
.crumb a{color:var(--soft)}
.nf-search input{font:inherit;font-size:var(--fs-form);border:0;border-bottom:1px solid var(--hair);background:transparent;color:var(--ink);padding:.2rem 0;width:min(22rem,100%)}
.nf-search input:focus{outline:none;border-bottom-color:var(--ink)}
.nf-h{font-weight:400;font-style:italic;font-size:var(--fs-body);margin:2rem 0 .4rem}

/* ---------- pass 8: linked words, home, store link, mobile ---------- */
.linked{max-width:44rem;margin-top:2.8rem}
.linked h2{margin-top:0}
.lk-h3{font-size:var(--fs-label);margin:1.3rem 0 .2rem;line-height:1.35}
.lk-h3 i{font-size:var(--fs-form)}
.lk-pairs{list-style:none;margin:0;padding:0}
.lk-pairs li{font-size:var(--fs-form);line-height:1.6}
.lk-note{color:var(--soft);font-size:var(--fs-label);margin-left:.35rem}
.lk-words{margin:0;font-size:var(--fs-form);line-height:1.7}
.lk-words .sep{color:var(--soft)}
.lk-more{color:var(--soft);font-style:italic}
.storelink{margin:2.4rem 0 0;font-size:var(--fs-label);color:var(--soft)}
.storelink a{color:var(--soft)}
.home .lede{margin-bottom:2rem}
.featured{list-style:none;margin:0;padding:0;max-width:40rem;border-top:1px solid var(--rule)}
.featured li{padding:.45rem 0;border-bottom:1px solid var(--rule);font-size:var(--fs-form);line-height:1.35}
.featured li a{font-style:italic}
.ft-line{color:var(--soft);font-size:var(--fs-label);margin-left:.5rem}
.home-on #search{flex:none;width:min(30rem,100%)}
.home-on #q{font-size:var(--fs-head)}
.hint .rw-play{display:inline-block;padding:.35rem 0}
.hw-form{max-width:100%}
/* QA-1 #23: long headwords (phrases) wrap and step down instead of running off a desktop page */
.hw.hw-long{white-space:normal;font-size:var(--fs-title);overflow-wrap:break-word}
@media (max-width:760px){
  html{-webkit-text-size-adjust:100%}
  body{padding:1rem 5.5% 3rem;overflow-wrap:break-word}
  .hw{white-space:normal;overflow-wrap:anywhere}
  .home-on #q{font-size:var(--fs-body)}
  .lede{font-size:var(--fs-body)}
  .featured li{padding:.6rem 0}
  .ft-line{display:block;margin:0}
  /* tap targets: inline links in lists get a taller hit area without moving the text */
  .lk-h3 a,.lk-words a,.lk-pairs a,.rootlist a,.members a,.nearlist a,.bloom a,.crumb a,.foot a,.sources a,.storelink a{padding:.55rem 0;background-origin:content-box;background-clip:content-box}
  .lk-words{line-height:2.1}
  .rootlist li,.rootpage ul.members li{padding:.3rem 0}
  .sn-ref{font-size:var(--fs-hint);padding:.4rem .35rem;margin:-.4rem -.2rem;line-height:1}
  .ax-tick span{font-size:var(--fs-hint)}
  .ax-tick small{font-size:var(--fs-hint)}
  .featured a,.rootlink a{display:inline-block;padding:.5rem 0;background-origin:content-box;background-clip:content-box}
  .rw .answer{font-size:var(--fs-form)}
  .st-top{height:auto;min-height:1.6rem;line-height:1.35}
}
.ax-label,.ax-label.flip{transform:none}
.axis{overflow:hidden;overflow:clip}
.rw-play{font:inherit;font-style:italic;color:inherit;background:none;border:0;padding:.35rem 0;margin:0;cursor:pointer;text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--hair);text-underline-offset:4px;-webkit-appearance:none;appearance:none;-webkit-tap-highlight-color:transparent}
.rw-play:hover,.rw-play:focus-visible{text-decoration-color:var(--ink)}
.ax-tick:nth-child(8) span{transform:translateX(-100%)}
/* REL-1: the version, quietly, in the footer: small grey text, no badge */
.license .thanks{font-style:italic;font-size:var(--fs-body);max-width:var(--measure)}   /* v0.1.8: the Sources page, one line in the italic body */
.license .thanks+.thanks{margin-top:.6rem}   /* v0.1.10: the second line, “Every lineage is traceable…” */
.license .type{margin-top:1.6rem;font-size:var(--fs-label);color:var(--soft);max-width:var(--measure)}
.license .thanks a,.license .type a{white-space:nowrap}   /* "CC BY-SA 4.0" and a font name never split */
.foot .ver{margin-top:1.4rem;font-size:var(--fs-hint);color:var(--soft);font-variant-numeric:oldstyle-nums;letter-spacing:.02em}
/* family tree (#42): the lineage's type scale (--fs-lang, --fs-form), hairlines; ink for the word's line to the root, grey for the rest, accent on the root only */
.tree{overflow-x:auto;overflow-y:hidden;margin:.6rem 0 2.2rem;padding:0;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.tree-box{position:relative;margin:0 auto;flex:none}
.tree-lines{position:absolute;left:0;top:0;overflow:visible}
.l-hair{fill:none;stroke:var(--hair);stroke-width:.75}
.l-ink{fill:none;stroke:var(--ink);stroke-width:1}
.t-n{position:absolute;white-space:nowrap;text-align:center;font:inherit;font-size:var(--fs-form);line-height:var(--lh-label);color:var(--soft);background:none;border:0;padding:0;margin:0}
.t-n .t-lang{display:block;font-size:var(--fs-hint);color:var(--faint)}
.t-n .t-f,.t-n .t-fold i{font-style:italic}
.t-n.ink{color:var(--ink)}
.t-n.me{color:var(--ink)}
.t-n.me .t-w{border-bottom:1px solid var(--ink)}
.t-n .t-more{font-style:italic;color:var(--faint)}
button.t-n{cursor:pointer;color:var(--soft)}
a.t-n{background:none}
a.t-n:hover .t-w,button.t-n:hover .t-fold{color:var(--ink)}
.tree-key{font-size:var(--fs-label);color:var(--soft);font-style:italic;margin:.2rem 0 0;max-width:var(--measure)}
@media (max-width:600px){.tree{margin-left:-5.5vw;margin-right:-5.5vw}}   /* full bleed: the scroll area is the screen, from its left edge (#47) */
/* home bonsai trailer (#46): the family tree's hairlines and type; height reserved before the data arrives (no shift);
   only transform, opacity and stroke-dashoffset animate; the bonsai's root is the page's one accent */
.bonsai{position:relative;max-width:var(--measure);height:15rem;margin:1.6rem auto 1.4rem;overflow:hidden;cursor:default;-webkit-tap-highlight-color:transparent}
.bz{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;transform:translateX(2.5rem);opacity:1;transition:transform 2.4s cubic-bezier(.2,.6,.2,1)}
.bz .tree-box{margin:0}
.bz .t-n{opacity:0;transition:opacity .9s ease-out calc(var(--g,0) * .5s + .2s)}
.bz path{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.8s ease-in-out .1s}
.bz.on{transform:none}.bz.on .t-n{opacity:1}.bz.on path{stroke-dashoffset:0}
.bz.out{transform:translateX(-5rem);opacity:0;transition:transform 1.2s ease-in,opacity .8s ease-in}
.bonsai .t-n.root .t-f{color:var(--red)}
.bonsai a.t-n.me .t-w{border-bottom:1px solid var(--ink)}
@media (prefers-reduced-motion:reduce){.bz .t-n,.bz path{transition:none}.bz,.bz.on,.bz.out{transform:none}.bz.out{opacity:0}}   /* still cycles: an instant swap (the rule at the top of this file stops every transition) */
@media (max-width:600px){.bonsai{height:14rem;margin:1rem auto}}
/* home, v0.1.5 (#46): everything centred: the masthead, the trailer, Ash's lines and the how-to; the footer as on every page */
body.home-on{padding-left:6.25%;padding-right:6.25%}
.home-on .masthead{flex-direction:column;align-items:center;gap:1rem}
.home-on #q,.home-on #suggest li{text-align:center}
.home{text-align:center}
.poem{margin:3rem auto 0;max-width:50rem;font-style:italic;font-size:var(--fs-body);line-height:1.5}
.poem p{margin:0}
.poem .ln{display:block;text-wrap:balance}
.poem .ln+.ln{margin-top:.35rem}
.poem .sig{margin-top:1.4rem;font-style:normal;font-size:var(--fs-label);font-variant-caps:all-small-caps;letter-spacing:var(--ls-sc);color:var(--soft);line-height:1.6}
.poem .sig .nw{white-space:nowrap}   /* one line, like signing a letter; on a narrow screen it breaks only after "Ash," */
.poem .sig .ash{font-family:"Pinyon Script",et-book,serif;font-size:2.3em;line-height:0;vertical-align:baseline;margin:0 .04em 0 .02em;font-variant-caps:normal;letter-spacing:0;color:var(--ink);font-synthesis:none}   /* v0.1.7: a signature, not a word: the script's x-height (.334em) is ~1.7x the synthesized small caps' cap height (.653 x .7 = .457em of the line), so 2.3em; line-height 0 keeps the line box (and the spacing) as it was; on the baseline. The one size outside the scale (S-TYPE-1) */
.howto{list-style:none;padding:0;margin:3.2rem auto 0;max-width:32rem;font-size:var(--fs-label);color:var(--soft);line-height:1.6}
.howto li{text-wrap:balance}.howto li+li{margin-top:.25rem}
.howto kbd{font:inherit}
@media (max-width:760px){.poem{margin-top:2.2rem}.howto{margin-top:2.4rem}}
