/* Threads: movements woven through time. Owner: threads view. */
:root{--th-ink:#011015;--th-ink2:#071a21;--th-cream:#EFE9D8;--th-paper:#F7F4EA;--th-dim:rgba(239,233,216,.64);--th-hair:rgba(239,233,216,.16);--tab-h:0px}
@media (max-width:860px){:root{--tab-h:calc(52px + env(safe-area-inset-bottom,0px))}}
html{background:var(--th-ink)}
body{margin:0;background:var(--th-ink);color:var(--th-cream);font-family:var(--lr-sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;color:inherit}
em,i.it{font-style:italic}

/* ---------- the loom (first screen) ---------- */
.loom{position:relative;margin-top:var(--nav-h);height:calc(100vh - var(--nav-h) - var(--tab-h));height:calc(100svh - var(--nav-h) - var(--tab-h));min-height:540px;overflow:hidden;background:var(--th-ink);isolation:isolate;
  user-select:none;-webkit-user-select:none}
.lm-ground,.lm-cloth{position:absolute;inset:0;width:100%;height:100%;display:block}
.lm-ground{z-index:0}
.lm-cloth{z-index:3;cursor:default;touch-action:pan-y}
.lm-cloth.is-hot{cursor:pointer}

/* title block: header text on the left, tools and key hints on the right */
.lm-title{position:absolute;z-index:6;left:28px;right:24px;top:22px;display:flex;justify-content:space-between;align-items:flex-start;gap:24px;pointer-events:none;
  transition:opacity .45s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.lm-head,.lm-side{pointer-events:auto}
.lm-head{max-width:780px;padding:14px 20px 16px;background:rgba(1,16,21,.84);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.lm-head .lab{margin:0 0 9px;color:var(--th-dim)}
.lm-head .lab span{opacity:.5;padding:0 .3em}
.lm-head h1{margin:0;font:500 34px/1.04 var(--lr-sans);letter-spacing:-.04rem;color:var(--th-cream)}
.lm-lede{margin:10px 0 0;font:400 16.5px/1.4 var(--lr-serif);color:rgba(239,233,216,.8);max-width:40em}
.lm-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.lm-tools{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;padding:6px;background:rgba(1,16,21,.84);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.btn{display:inline-flex;align-items:center;gap:10px;height:36px;padding:0 14px;border:1px solid rgba(239,233,216,.42);background:transparent;cursor:pointer;
  font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--th-cream);text-decoration:none;transition:background .2s,border-color .2s,color .2s}
.btn:hover{border-color:var(--th-cream);background:rgba(239,233,216,.08)}
.btn i{font-style:normal;opacity:.7;letter-spacing:0}
.btn-ghost{border-color:transparent;padding:0 10px;opacity:.8}
.btn-ghost:hover{opacity:1;background:transparent;border-color:transparent;text-decoration:underline;text-underline-offset:4px}
.loom.is-follow .lm-title{opacity:0;pointer-events:none;transform:translateY(-14px)}
.loom.is-follow .lm-head,.loom.is-follow .lm-side{pointer-events:none}

.lm-keys{margin:0;padding:6px 8px;color:rgba(239,233,216,.62);text-align:right;background:rgba(1,16,21,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);max-width:300px;line-height:1.6}
.lm-keys:empty{display:none}
.lm-keys span{display:block;white-space:nowrap}
.lm-keys kbd{font:500 10.5px/1 var(--lr-sans);letter-spacing:0;padding:2px 5px;border:1px solid rgba(239,233,216,.3);border-radius:3px;margin:0 1px}
.cd-keys{margin:10px 0 8px;color:var(--lr-dim);line-height:1.8}
.cd-keys kbd{font:500 10.5px/1 var(--lr-sans);letter-spacing:0;padding:2px 5px;border:1px solid var(--lr-hair);border-radius:3px;margin:0 1px;color:var(--lr-ink)}

/* era strip under the cloth */
.lm-eras{position:absolute;z-index:5;left:0;top:0;width:100%;height:0;pointer-events:none}
.era{position:absolute;display:block;pointer-events:auto;padding:8px 6px 0 0;border-top:2px solid var(--ec);color:var(--th-cream);text-decoration:none;overflow:hidden;
  opacity:0;transform:translateY(10px);transition:opacity .55s ease,transform .7s cubic-bezier(.2,.8,.2,1),border-color .3s}
.era.in{opacity:1;transform:none}
.era b{display:block;font:500 13px/1 var(--lr-sans);letter-spacing:.02em}
.era span{display:block;margin-top:5px;font:500 10.5px/1.2 var(--lr-sans);letter-spacing:.08em;text-transform:uppercase;color:rgba(239,233,216,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.era span em{font-style:normal}
.era.two span{white-space:normal}
.era.two span em{display:block}
.era.sm span{font-size:8.5px;letter-spacing:0}
.era.smn small{font-size:9.5px;letter-spacing:0}
.era.nosm small{display:none}
.era small{display:block;margin-top:3px;font:400 10.5px/1.2 var(--lr-sans);letter-spacing:.04em;color:rgba(239,233,216,.46);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.era.is-on span{color:var(--th-cream)}
.era.is-on{border-top-width:4px}
.era:focus-visible{outline-offset:-2px}

.lm-legend{position:absolute;z-index:5;right:10px;width:196px;margin:0;color:rgba(239,233,216,.56);font:400 10.5px/1.25 var(--lr-sans);letter-spacing:.02em;transition:opacity .4s}
.lm-legend p{display:flex;align-items:center;gap:8px;margin:0 0 3px}
.lm-legend svg{width:30px;height:10px;flex:0 0 auto;overflow:visible}
.lm-legend .lm-legend-dye{display:block;margin-top:5px;color:rgba(239,233,216,.44)}
.loom.is-follow .lm-legend{opacity:0;pointer-events:none}
.lm-legend.is-pop{top:auto;bottom:56px;padding:12px 14px 10px;background:var(--th-ink);border:1px solid rgba(239,233,216,.24);box-shadow:6px 7px 0 rgba(0,0,0,.4);
  opacity:0;pointer-events:none;transform:translateY(6px);transition:opacity .25s ease,transform .35s cubic-bezier(.2,.8,.2,1)}
.lm-legend.is-pop.on{opacity:1;pointer-events:auto;transform:none}
.loom.is-follow .lm-legend.is-pop{opacity:0;pointer-events:none}
.lm-keybtn{position:absolute;z-index:6;right:10px;bottom:10px;height:40px;padding:0 12px;border:1px solid rgba(239,233,216,.3);background:rgba(1,16,21,.86);cursor:pointer;
  font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:rgba(239,233,216,.8);transition:border-color .2s,color .2s}
.lm-keybtn:hover,.lm-keybtn[aria-expanded="true"]{border-color:var(--th-cream);color:var(--th-cream)}
.lm-keybtn[hidden],.loom.is-follow .lm-keybtn{display:none}
.lm-fkeys.is-off{display:none}
.lm-fkeys{position:absolute;z-index:5;left:auto;right:18px;width:188px;margin:0;color:rgba(239,233,216,.6);font:400 11.5px/1.85 var(--lr-sans);letter-spacing:.01em;opacity:0;pointer-events:none;transition:opacity .5s ease .3s}
.lm-fkeys kbd{font:500 10.5px/1 var(--lr-sans);letter-spacing:0;padding:2px 5px;border:1px solid rgba(239,233,216,.3);border-radius:3px;margin-right:3px;color:var(--th-cream)}
.loom.is-follow .lm-fkeys{opacity:1}

/* Era context */
.lm-era-note{position:absolute;z-index:4;left:0;top:0;margin:0;padding:6px 9px 5px;background:rgba(1,16,21,.86);color:rgba(239,233,216,.82);white-space:nowrap;
  opacity:0;transform:translateY(4px);transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.lm-era-note.on{opacity:1;transform:none}
.loom:not(.is-follow) .lm-era-note.on{transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1),left .5s cubic-bezier(.2,.8,.2,1),top .3s ease}
.lm-era-note .lv-n{display:block;max-width:460px;font:400 12.5px/1.35 var(--lr-sans);letter-spacing:.01em;text-transform:none;color:var(--th-cream);white-space:normal}
.lm-era-note .lv-n b{font-weight:500;color:var(--lr-orange);margin-right:3px}


/* a link to a movement that is not one of the forty */
.lm-note{position:absolute;z-index:8;left:28px;top:calc(var(--note-top,250px));max-width:520px;padding:14px 16px 12px;background:var(--th-paper);color:var(--lr-ink);box-shadow:8px 9px 0 var(--lr-orange);
  animation:cdin .45s cubic-bezier(.2,.8,.2,1)}
.lm-note p{margin:0;font:400 17px/1.4 var(--lr-serif)}
.lm-note b{font-weight:500}
.lm-note div{display:flex;gap:8px;margin-top:12px}
.lm-note .btn{color:var(--lr-ink);border-color:rgba(1,16,21,.35)}
.lm-note .btn:hover{border-color:var(--lr-ink);background:rgba(1,16,21,.04)}
.loom.is-follow .lm-note{display:none}
@media (max-width:719px){.lm-note{left:10px;right:10px;max-width:none;top:auto;bottom:60px}}

/* hover tip */
.lm-tip{position:absolute;z-index:8;left:0;top:0;max-width:300px;padding:10px 12px 11px;background:var(--th-ink);border:1px solid rgba(239,233,216,.22);
  box-shadow:6px 7px 0 rgba(0,0,0,.35);pointer-events:none;opacity:0;transition:opacity .15s;font:400 13px/1.3 var(--lr-sans)}
.lm-tip.on{opacity:1}
.lm-tip .t-name{display:flex;align-items:center;gap:8px;font-weight:500;font-size:14px}
.lm-tip .t-meta{margin-top:4px;color:rgba(239,233,216,.66);font-size:12px}
.lm-tip .t-go{margin-top:6px;color:rgba(239,233,216,.46);font:500 10px/1 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase}
.lm-tip .t-m{font:400 15px/1.25 var(--lr-serif);color:var(--th-cream);margin-top:2px}
.lm-tip .t-rib{display:block;width:100%;min-width:220px;height:22px;margin-top:8px}
.sw{display:inline-block;width:18px;height:6px;flex:0 0 auto;background:repeating-linear-gradient(115deg,var(--c) 0 3px,var(--c2,rgba(0,0,0,.35)) 3px 5px)}

/* scroll cue */
.lm-cue{position:absolute;z-index:6;left:50%;bottom:10px;transform:translateX(-50%);display:inline-flex;white-space:nowrap;align-items:center;gap:10px;height:40px;padding:0 16px;
  border:0;background:transparent;color:rgba(239,233,216,.7);cursor:pointer;font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;transition:color .2s}
.lm-cue:hover{color:var(--th-cream)}
.lm-cue i{font-style:normal;display:inline-block;animation:cue 2.4s cubic-bezier(.4,0,.2,1) infinite}
@keyframes cue{0%,60%,100%{transform:none}30%{transform:translateY(4px)}}
.loom.is-follow .lm-cue{display:none}

/* follow card */
.lm-card{position:absolute;z-index:7;left:28px;top:22px;width:440px;max-height:calc(var(--card-max,480px));display:flex;flex-direction:column;
  background:var(--th-paper);color:var(--lr-ink);box-shadow:10px 11px 0 var(--ec,#B08A4E);opacity:0;transform:translateY(12px);
  transition:opacity .5s ease,transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .6s ease}
.lm-card.on{opacity:1;transform:none}
.lm-card[hidden]{display:none}
.cd-top{display:flex;align-items:center;gap:10px;padding:12px 10px 10px 18px;border-bottom:1px solid var(--lr-hair)}
.cd-thread{display:flex;align-items:center;gap:9px;min-width:0;min-height:36px;padding:0;border:0;background:none;cursor:pointer;color:var(--lr-ink);font:500 10.5px/1.15 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;text-align:left}
.cd-thread em{font-style:normal;opacity:.55;letter-spacing:0}
.cd-thread:hover b{text-decoration:underline;text-decoration-color:var(--lr-orange);text-underline-offset:3px}
.cd-thread b{font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cd-pos{margin-left:auto;font:500 10.5px/1 var(--lr-sans);letter-spacing:.08em;color:var(--lr-dim);white-space:nowrap;font-variant-numeric:tabular-nums}
.cd-x{flex:0 0 auto;width:40px;height:40px;border:0;background:transparent;cursor:pointer;font-size:22px;line-height:1;color:var(--lr-ink);opacity:.6}
.cd-x:hover{opacity:1}
.cd-scroll{overflow:auto;padding:14px 18px 4px;min-height:0;flex:1 1 auto;overscroll-behavior:contain}
.cd-anim{animation:cdin .42s cubic-bezier(.2,.8,.2,1)}
@keyframes cdin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.cd-ch{display:flex;align-items:center;gap:8px;margin:0 0 10px;color:var(--lr-dim)}
.cd-ch i{width:10px;height:10px;background:var(--ec);display:inline-block;box-shadow:inset 0 0 0 1px rgba(1,16,21,.25)}
.cd-year{margin:0;font:500 26px/1 var(--lr-sans);letter-spacing:-.04rem;font-variant-numeric:tabular-nums}
/* the moment's print: its archival image (or, when the archive is absent, its era plate) beside the year and title */
.cd-print{float:right;width:96px;height:96px;margin:0 0 8px 16px;background:#E6DFCB;position:relative}
.cd-print::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(1,16,21,.14);pointer-events:none}
.cd-print canvas{display:block;width:100%;height:100%;opacity:0;transition:opacity .45s ease}
.cd-print.on canvas{opacity:1}
/* no archival image here (the archive is absent): the era plate is a generic study in the medium of its chapter, and says so */
.cd-print.is-plate::before{content:"Era study";position:absolute;left:0;right:0;bottom:0;z-index:1;padding:3px 0 2px;background:rgba(1,16,21,.78);color:rgba(239,233,216,.9);
  font:500 9.5px/1.2 var(--lr-sans);letter-spacing:.12em;text-transform:uppercase;text-align:center}
.cd-title{margin:6px 0 0;font:400 23px/1.14 var(--lr-serif);letter-spacing:-.005em}
.cd-title a{color:inherit;text-decoration:none;background:linear-gradient(currentColor,currentColor) 0 100%/0 1px no-repeat;transition:background-size .3s}
.cd-title a:hover{background-size:100% 1px}
.cd-meta{margin:8px 0 0;font:400 12.5px/1.3 var(--lr-sans);color:var(--lr-dim)}
.flag{display:inline-block;padding:2px 6px 1px;margin-left:4px;background:var(--lr-orange);color:#fff;font:500 9.5px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;vertical-align:1px}
.cd-body{margin:10px 0 0;font:400 16px/1.42 var(--lr-serif);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.cd-body p{margin:0}
.cd-body a{color:inherit}
.cd-cross{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.cd-cross .lab{color:var(--lr-dim);margin-right:2px}
.chip{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 9px;border:1px solid var(--lr-hair);background:transparent;cursor:pointer;font:400 12.5px/1 var(--lr-sans);color:var(--lr-ink);text-decoration:none;transition:border-color .2s,background .2s}
@media (hover:hover){.chip:hover{border-color:var(--lr-ink);background:rgba(1,16,21,.04)}}
.chip .sw{width:12px;height:5px}
.chip.is-b{border-color:var(--lr-blue)}
.cd-cmp{margin:12px 0 4px;padding:10px 12px;background:rgba(2,176,244,.09);font:400 13px/1.35 var(--lr-sans)}
.cd-cmp b{font-weight:500}
.cd-cmp .row{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.cd-cmp .row .chip{min-height:30px;padding:0 8px;font:500 10px/1 var(--lr-sans);letter-spacing:.1em;text-transform:uppercase}
.cd-cmp .row .chip:disabled{opacity:.35;cursor:default}
.cd-cmp .sw{vertical-align:1px}
.lm-card.is-cmp .cd-body{-webkit-line-clamp:2}
.lm-card.is-tight .cd-body{-webkit-line-clamp:2}
.lm-card.is-tight.is-cmp .cd-body,.lm-card.is-tight2 .cd-body{-webkit-line-clamp:1}
.lm-card.is-tight .cd-tools{margin:10px 0 8px}
.lm-card.is-tight2 .cd-cross{display:none}
/* a short window: a smaller title and print, then the opening line goes, so the compare and step controls stay in view */
.lm-card.is-tight2 .cd-title{font-size:20px}
.lm-card.is-tight2 .cd-print{width:72px;height:72px;margin-bottom:4px}
.lm-card.is-tight3 .cd-body{display:none}
.lm-card.is-tight3 .cd-ch{margin-bottom:6px}
.cd-shared{display:inline-block;padding:2px 6px 1px;margin-left:4px;background:var(--lr-blue);color:var(--lr-ink);font:500 9.5px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;vertical-align:1px}
.cd-nav{display:flex;gap:0;border-top:1px solid var(--lr-hair);flex:0 0 auto}
.cd-nav button,.cd-nav a{flex:1 1 0;height:46px;display:flex;align-items:center;justify-content:center;gap:8px;border:0;border-right:1px solid var(--lr-hair);background:transparent;cursor:pointer;
  font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lr-ink);text-decoration:none;transition:background .15s}
.cd-nav>*:last-child{border-right:0}
@media (hover:hover){.cd-nav button:hover,.cd-nav a:hover{background:rgba(1,16,21,.05)}}
.cd-nav button:disabled{opacity:.3;cursor:default;background:transparent}
.cd-nav .cd-open{background:var(--lr-ink);color:var(--th-cream)}
.cd-nav .cd-play{flex:0 0 100px;gap:8px}
.cd-play svg{width:9px;height:9px;fill:currentColor;flex:0 0 auto}
.cd-nav .cd-play[aria-pressed="true"]{background:rgba(255,76,0,.1);color:#B23500}
.cd-prog{display:block;position:relative;height:2px;flex:0 0 auto;margin-bottom:-1px;z-index:1}
.cd-prog::after{content:"";position:absolute;left:0;top:0;bottom:0;width:0;background:var(--lr-orange)}
.lm-card.is-play .cd-prog::after{animation:cdprog 4.2s linear forwards}
@keyframes cdprog{to{width:100%}}
.cd-nav .cd-open:hover{background:#0b2a33}
.cd-tools{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0 12px}
.cd-tools .chip{font:500 10px/1 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;min-height:30px}

/* picker */
.picker{position:fixed;z-index:60;left:28px;top:calc(var(--nav-h) + 22px);width:380px;max-height:min(640px,calc(100vh - var(--nav-h) - 60px));display:flex;flex-direction:column;
  background:var(--th-ink);border:1px solid rgba(239,233,216,.28);box-shadow:10px 11px 0 rgba(0,0,0,.45);color:var(--th-cream)}
.picker[hidden]{display:none}
.pk-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 8px 10px 14px;border-bottom:1px solid var(--th-hair)}
.pk-head .lab{margin:0;flex:1 1 auto;color:var(--th-dim)}
.pk-head input{order:3;flex:1 0 100%;height:38px;padding:0 10px;border:1px solid rgba(239,233,216,.3);background:rgba(239,233,216,.05);color:var(--th-cream);font:400 15px/1 var(--lr-sans);border-radius:0;outline:0}
.pk-head input:focus{border-color:var(--lr-orange)}
.pk-x{width:40px;height:40px;border:0;background:transparent;color:var(--th-cream);font-size:22px;cursor:pointer;opacity:.7}
.pk-list{list-style:none;margin:0;padding:6px 0;overflow:auto;overscroll-behavior:contain}
.pk-list button{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;width:100%;min-height:40px;padding:6px 14px;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--th-cream)}
.pk-list button:focus-visible,.pk-list button.is-k{background:rgba(239,233,216,.08)}
@media (hover:hover){.pk-list button:hover{background:rgba(239,233,216,.08)}}
.pk-list .sw{width:22px}
.pk-list .pk-n{font:400 14.5px/1.2 var(--lr-sans)}
.pk-list .pk-c{font:500 11px/1 var(--lr-sans);letter-spacing:.02em;color:rgba(239,233,216,.5);text-align:right;white-space:nowrap}
.pk-list .pk-c small{display:block;margin-top:3px;font-size:10px;letter-spacing:.04em;opacity:.8}
.pk-list .is-sel .pk-n{color:var(--lr-orange)}

/* ---------- the reading page (scroll down) ---------- */
.read{position:relative;background:var(--th-paper);color:var(--lr-ink);padding:0 0 calc(80px + var(--tab-h));scroll-margin-top:calc(var(--nav-h) - 1px)}
.rd-wrap{max-width:1580px;margin:0 auto;padding:64px clamp(20px,4.4vw,80px) 0}
.rd-kick{margin:0;color:var(--lr-dim)}
.rd-h{margin:10px 0 0;font:500 clamp(40px,5.4vw,68px)/1 var(--lr-sans);letter-spacing:-.04rem}
.rd-h .sw{width:46px;height:14px;vertical-align:.18em;margin-right:16px}
.rd-stats{margin:14px 0 0;font:400 14px/1.4 var(--lr-sans);color:var(--lr-dim);letter-spacing:.01em}
.rd-stats b{font-weight:500;color:var(--lr-ink)}
.rd-arc{margin:18px 0 0;max-width:46em;font:400 19px/1.5 var(--lr-serif)}
.rd-arc a,.rd-list a,.rd-side a{color:inherit;text-decoration:underline;text-decoration-color:rgba(1,16,21,.3);text-underline-offset:3px;text-decoration-thickness:1px}
.rd-arc a:hover,.rd-list a:hover,.rd-side a:hover{text-decoration-color:var(--lr-orange)}
.rd-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.rd-actions .btn,.rd-nextprev .btn,.rd-side .btn{border-color:rgba(1,16,21,.35);color:var(--lr-ink)}
.rd-actions .btn:hover,.rd-nextprev .btn:hover,.rd-side .btn:hover{border-color:var(--lr-ink);background:rgba(1,16,21,.04)}
.rd-actions .btn-solid{background:var(--lr-ink);color:var(--th-cream);border-color:var(--lr-ink)}
.rd-actions .btn-solid:hover{background:#0b2a33;color:var(--th-cream)}
.rd-ribbon{display:block;width:100%;height:120px;margin-top:30px;overflow:visible}
.rd-eras{display:grid;grid-template-columns:var(--ecols,repeat(10,1fr));gap:0;margin-top:0;border-top:1px solid var(--lr-hair)}
.rd-eras div{padding:8px 6px 0 0;font:500 10.5px/1.25 var(--lr-sans);letter-spacing:.06em;color:var(--lr-dim);min-width:0}
.rd-eras div b{display:block;font:500 17px/1 var(--lr-sans);color:var(--lr-ink);letter-spacing:0}
.rd-eras div.is-zero b{color:rgba(1,16,21,.25)}
.rd-eras div span{display:block;margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.rd-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:72px;margin-top:56px;align-items:start}
.rd-sec{margin:0 0 44px}
.rd-sec>h3{margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--lr-ink);font:500 10.5px/1.2 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;display:flex;justify-content:space-between;gap:12px}
.rd-sec>h3 small{font:inherit;color:var(--lr-dim);letter-spacing:.08em}
.rd-note{margin:-4px 0 14px;font:400 14px/1.45 var(--lr-serif);color:var(--lr-dim)}

/* moment by moment: the thread continues down the page as a spine */
.rd-list{list-style:none;margin:0;padding:0;position:relative}
.rd-chh{position:relative;padding:22px 0 8px 46px;display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.rd-chh:first-child{padding-top:4px}
.rd-chh b{font:500 22px/1 var(--lr-sans);letter-spacing:-.04rem}
.rd-chh span{font:500 10.5px/1.2 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lr-dim)}
.rd-chh::before{content:"";position:absolute;left:12px;top:26px;width:12px;height:12px;background:var(--ec);box-shadow:inset 0 0 0 1px rgba(1,16,21,.25)}
.rd-chh:first-child::before{top:8px}
.rd-m{position:relative;display:grid;grid-template-columns:100px minmax(0,1fr);gap:4px 14px;padding:9px 8px 9px 46px;border-radius:0;transition:background .2s}
.rd-m::before{content:"";position:absolute;left:16px;top:0;bottom:0;width:5px;background:repeating-linear-gradient(160deg,var(--c) 0 3px,var(--c2) 3px 6px)}
.rd-m .bead{position:absolute;left:-1px;top:1px;width:40px;height:40px;padding:0;border:0;background:transparent;cursor:pointer;border-radius:50%}
.rd-m .bead::after{content:"";position:absolute;left:14px;top:15px;width:11px;height:11px;border-radius:50%;background:var(--th-paper);box-shadow:0 0 0 2px var(--c3);transition:transform .15s}
.rd-m.is-all .bead::after{background:var(--lr-orange)}
.rd-m .bead:hover::after{transform:scale(1.25)}
.rd-m .y{font:500 13px/1.5 var(--lr-sans);font-variant-numeric:tabular-nums;color:var(--lr-dim);padding-top:2px}
.rd-m .tt{font:400 18px/1.3 var(--lr-serif)}
.rd-m .tt a{text-decoration:none}
.rd-m .tt a:hover{text-decoration:underline;text-decoration-color:var(--lr-orange)}
.rd-m .mt{grid-column:2;font:400 12px/1.3 var(--lr-sans);color:var(--lr-dim)}
.rd-m .mt .also{color:rgba(1,16,21,.5)}
.rd-m[hidden]{display:none}
.rd-m.is-here{background:rgba(255,76,0,.08)}
.rd-m.is-here .bead::after{box-shadow:0 0 0 3px var(--lr-orange)}
.rd-m.is-dim{opacity:.28}
.rd-m.is-shared .tt::after{content:"shared";margin-left:8px;padding:1px 5px 0;background:var(--lr-blue);color:var(--lr-ink);font:500 9px/1.3 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;vertical-align:3px}
.rd-more{margin:4px 0 10px 46px;height:34px;padding:0 12px;border:1px solid rgba(1,16,21,.3);background:transparent;cursor:pointer;font:500 10px/1 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase}
.rd-more:hover{border-color:var(--lr-ink)}

.rd-side ul{list-style:none;margin:0;padding:0}
.rd-rel li{display:grid;grid-template-columns:1fr auto;align-items:center;gap:6px 12px;padding:10px 0;border-bottom:1px solid var(--lr-hair)}
.rd-rel .nm{display:flex;align-items:center;gap:10px;font:400 16px/1.2 var(--lr-sans);min-width:0}
.rd-rel .nm button{border:0;background:none;padding:0;cursor:pointer;text-align:left;font:inherit;color:inherit;text-decoration:underline;text-decoration-color:rgba(1,16,21,.25);text-underline-offset:3px}
.rd-rel .nm button:hover{text-decoration-color:var(--lr-orange)}
.rd-rel .ct{font:500 11px/1.2 var(--lr-sans);letter-spacing:.06em;color:var(--lr-dim);text-align:right;white-space:nowrap}
.rd-rel .bar{grid-column:1 / -1;height:4px;background:rgba(1,16,21,.08);position:relative}
.rd-rel .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--c)}
.rd-rel .cmpb{grid-column:2;grid-row:1;height:30px;padding:0 10px;border:1px solid rgba(1,16,21,.3);background:transparent;cursor:pointer;font:500 9.5px/1 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase}
.rd-rel .cmpb:hover{border-color:var(--lr-ink)}
.rd-ppl{display:flex;flex-wrap:wrap;gap:6px 6px}
.rd-ppl a{display:inline-flex;align-items:center;gap:6px;min-height:32px;padding:0 10px;border:1px solid var(--lr-hair);text-decoration:none!important;font:400 14px/1 var(--lr-sans)}
.rd-ppl a:hover{border-color:var(--lr-ink)}
.rd-ppl a small{font:500 10.5px/1 var(--lr-sans);color:var(--lr-dim)}
.rd-tags{display:flex;flex-wrap:wrap;gap:6px}
.rd-tg{margin:16px 0 8px;font:500 10px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lr-dim)}
.rd-tg:first-of-type{margin-top:4px}
.rd-tagacts{display:inline-flex;flex-wrap:wrap;gap:6px;margin-left:6px;vertical-align:middle}
.rd-tagacts .chip{min-height:30px;font:400 12.5px/1 var(--lr-sans)}
.rd-tags button{min-height:32px;padding:0 10px;border:1px solid var(--lr-hair);background:transparent;cursor:pointer;font:400 13.5px/1 var(--lr-sans);color:var(--lr-ink)}
.rd-tags button small{margin-left:6px;font:500 10.5px/1 var(--lr-sans);color:var(--lr-dim)}
.rd-tags button:hover{border-color:var(--lr-ink)}
.rd-tags button[aria-pressed="true"]{background:var(--lr-ink);color:var(--th-paper);border-color:var(--lr-ink)}
.rd-tags button[aria-pressed="true"] small{color:rgba(252,251,247,.7)}
.rd-eds li,.rd-pods li{padding:12px 0;border-bottom:1px solid var(--lr-hair)}
.rd-eds a.t,.rd-pods .t{display:block;font:400 18px/1.25 var(--lr-serif);text-decoration:none!important}
.rd-eds a.t:hover{color:#b23500}
.rd-eds .m,.rd-pods .m{margin-top:5px;font:400 12px/1.35 var(--lr-sans);color:var(--lr-dim)}
.rd-pods .ln{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:8px;font:500 10.5px/1 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase}
.rd-pods .ln a{white-space:nowrap;text-decoration:none!important;border-bottom:1px solid rgba(1,16,21,.3);padding-bottom:2px}
.rd-pods .ln a:hover{border-color:var(--lr-orange)}
.rd-pods .ln a.is-lr{border-bottom-color:var(--lr-orange)}
.rd-pods a.t:hover{color:#b23500}
.rd-pods .ep{display:inline-block;margin-right:6px;padding:2px 6px 1px;background:var(--lr-ink);color:var(--th-paper);font:500 9.5px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;vertical-align:2px}
.rd-empty{font:400 15px/1.45 var(--lr-serif);color:var(--lr-dim);margin:0}
.rd-linkbox{flex:1 1 320px;min-width:0;height:36px;padding:0 10px;border:1px solid var(--lr-orange);background:#fff;color:var(--lr-ink);font:400 13px/1 var(--lr-sans);border-radius:0}
.rd-loading{font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lr-dim)}

/* compare block */
.rd-cmp{margin-top:48px;padding:26px 28px 28px;background:#F3EFE3;border-top:3px solid var(--lr-blue)}
.rd-cmp h3{margin:0;font:500 26px/1.1 var(--lr-sans);letter-spacing:-.04rem;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.rd-cmp h3 .x{font-weight:400;color:var(--lr-dim)}
.cm-key{display:inline-block;width:30px;height:12px;flex:0 0 auto;background:var(--c)}
.cm-key.b,.rd-cmp .cm-bars i.b{background:repeating-linear-gradient(135deg,var(--c) 0 2.5px,transparent 2.5px 5px);box-shadow:inset 0 0 0 1.5px var(--c)}
.rd-cmp .cm-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:0;margin-top:20px}
.rd-cmp .cm-col{display:flex;flex-direction:column;align-items:stretch;gap:3px;padding-right:6px;min-width:0}
.rd-cmp .cm-bars{height:84px;display:flex;align-items:flex-end;gap:3px}
.rd-cmp .cm-bars i{flex:1 1 0;display:block;min-height:1px}
.rd-cmp .cm-col span b{font-weight:500}
.rd-cmp .cm-col span{font:500 10px/1.2 var(--lr-sans);letter-spacing:.06em;color:var(--lr-dim);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;border-top:1px solid var(--lr-hair);padding-top:5px}
.rd-cmp .cm-sum{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:20px;font:400 14px/1.35 var(--lr-sans)}
.rd-cmp .cm-sum b{font:500 26px/1 var(--lr-sans);display:block}
.rd-cmp ol{margin:18px 0 0;padding:0;list-style:none;columns:2;column-gap:36px}
.rd-cmp ol li{break-inside:avoid;padding:6px 0;border-bottom:1px solid var(--lr-hair);font:400 16px/1.3 var(--lr-serif)}
.rd-cmp ol li small{font:500 11px/1 var(--lr-sans);color:var(--lr-dim);margin-right:8px;font-variant-numeric:tabular-nums}
.rd-cmp ol a{color:inherit;text-decoration:none}
.rd-cmp ol a:hover{text-decoration:underline;text-decoration-color:var(--lr-orange)}

/* overview index of all threads */
.rd-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--lr-ink)}
.rd-index li{border-bottom:1px solid var(--lr-hair)}
.rd-index button{display:grid;grid-template-columns:34px minmax(170px,240px) minmax(0,1fr) 160px;align-items:center;gap:18px;width:100%;min-height:56px;padding:6px 0;border:0;background:transparent;cursor:pointer;text-align:left;color:var(--lr-ink);transition:background .2s}
@media (hover:hover){.rd-index button:hover{background:rgba(1,16,21,.035)}}
.rd-index .n{font:500 11px/1 var(--lr-sans);color:var(--lr-dim);text-align:right}
.rd-index .nm{font:500 19px/1.15 var(--lr-sans);letter-spacing:-.04rem}
.rd-index svg{display:block;width:100%;height:40px;overflow:visible}
.rd-index .sp{font:400 12.5px/1.3 var(--lr-sans);color:var(--lr-dim);text-align:right;white-space:nowrap}
.rd-index .sp b{display:block;font:500 15px/1.1 var(--lr-sans);color:var(--lr-ink)}
.rd-idxhead{display:grid;grid-template-columns:34px minmax(170px,240px) minmax(0,1fr) 160px;gap:18px;padding:0 0 8px}
.rd-idxhead span{font:500 10px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lr-dim)}
.rd-idxhead .eras{display:grid;grid-template-columns:var(--ecols);}
.rd-idxhead .eras span{border-left:1px solid var(--lr-hair);padding-left:4px;overflow:hidden;white-space:nowrap}
.rd-ledger{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0 22px}
.rd-led{padding:14px 0 18px;border-top:3px solid var(--ec)}
.rd-led h4{margin:0;font:500 20px/1 var(--lr-sans);letter-spacing:-.04rem}
.rd-led h4 small{display:block;margin-top:6px;font:500 10px/1.2 var(--lr-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--lr-dim)}
.rd-led p{margin:12px 0 0;font:500 9.5px/1.2 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lr-dim)}
.rd-led ul{list-style:none;margin:5px 0 0;padding:0}
.rd-led li{font:400 14px/1.3 var(--lr-sans);padding:3px 0}
.rd-led li button{border:0;background:none;padding:2px 0;cursor:pointer;text-align:left;font:inherit;color:inherit;display:flex;align-items:center;gap:7px}
.rd-led li button:hover{text-decoration:underline;text-decoration-color:var(--lr-orange);text-underline-offset:3px}
.rd-led li .sw{width:12px;height:5px}
.rd-led .none{color:rgba(1,16,21,.35);font-size:13px}
.rd-pairs li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 0;border-bottom:1px solid var(--lr-hair)}
.rd-pairs button{border:0;background:none;padding:4px 0;cursor:pointer;text-align:left;font:400 16px/1.25 var(--lr-sans);color:inherit;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.rd-pairs button:hover .pn{text-decoration:underline;text-decoration-color:var(--lr-orange);text-underline-offset:3px}
.rd-pairs .x{color:var(--lr-dim)}
.rd-pairs small{font:500 11px/1.2 var(--lr-sans);color:var(--lr-dim);white-space:nowrap}

.rd-nextprev{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:center;margin-top:24px;padding-top:26px;border-top:1px solid var(--lr-ink)}
.rd-nextprev button.np{display:flex;flex-direction:column;gap:6px;align-items:flex-start;border:0;background:none;cursor:pointer;padding:6px 0;color:var(--lr-ink);text-align:left}
.rd-nextprev button.np:last-child{align-items:flex-end;text-align:right}
.rd-nextprev .np span{font:500 10.5px/1 var(--lr-sans);letter-spacing:.16em;text-transform:uppercase;color:var(--lr-dim)}
.rd-nextprev .np b{font:500 24px/1.1 var(--lr-sans);letter-spacing:-.04rem;display:flex;align-items:center;gap:10px}
.rd-nextprev .np:hover b{text-decoration:underline;text-decoration-color:var(--lr-orange);text-underline-offset:4px;text-decoration-thickness:1px}
.rd-foot{margin-top:40px;font:400 13px/1.5 var(--lr-sans);color:var(--lr-dim);max-width:60em}

/* the live region sits at the top of the page with no margins, so it never adds a strip of scroll below the paper */
.sr{position:absolute;top:0;left:0;margin:0;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- tablet and phone ---------- */
@media (max-width:1100px){
  .rd-grid{grid-template-columns:minmax(0,1fr) 300px;gap:44px}
  .rd-ledger{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:860px){
  .rd-grid{grid-template-columns:minmax(0,1fr);gap:8px}
  .rd-index button,.rd-idxhead{grid-template-columns:26px minmax(0,1fr) 92px;gap:12px}
  .rd-index svg,.rd-idxhead .eras{grid-column:1 / -1;order:4}
  .rd-idxhead .eras{display:none}
  .rd-index svg{height:30px;margin:2px 0 6px}
  .rd-index .sp{white-space:normal}
  .pk-list .pk-c{white-space:normal}
  .rd-cmp ol{columns:1}
}
@media (max-width:719px){
  .lm-title{left:10px;right:10px;top:10px;flex-direction:column;gap:0;background:rgba(1,16,21,.92)}
  .lm-head{padding:12px 12px 6px;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;max-width:none}
  .lm-head .lab{margin-bottom:6px}
  .lm-head h1{font-size:23px;line-height:1.08}
  .lm-lede{display:none}
  .lm-side{align-items:stretch;width:100%}
  .lm-tools{justify-content:flex-start;padding:4px 6px 8px;background:none;-webkit-backdrop-filter:none;backdrop-filter:none}
  .btn{height:40px}
  .lm-keys,.lm-legend,.cd-keys{display:none}
  .era{padding:0 0 0 7px;border-top:0;border-left:3px solid var(--ec);transform:translateX(-8px)}
  .era.in{transform:none}
  .era b{font-size:12px}
  .era span{font-size:9.5px;letter-spacing:.04em;margin-top:3px}
  .era small{display:none}
  .era.is-on{border-left-width:5px}
  .era.tight span{display:none}
  .era.tight b{font-size:11px}
  .lm-cue{bottom:4px}
  .lm-card{left:0;right:0;top:auto;bottom:0;width:auto;height:var(--card-max,47%);max-height:none;box-shadow:0 -6px 0 var(--ec,#B08A4E);transform:translateY(30px)}
  .lm-card.on{transform:none}
  .cd-top{padding:6px 4px 4px 14px}
  .cd-scroll{padding:10px 14px 4px}
  .cd-year{font-size:20px}
  .cd-print{width:64px;height:64px;margin:0 0 6px 12px}
  .cd-print.is-plate::before{font-size:8px;letter-spacing:.05em}
  .cd-title{font-size:19px;margin-top:3px}
  .cd-meta{margin-top:5px}
  .cd-body{font-size:15px;-webkit-line-clamp:2;margin-top:6px}
  .cd-ch{margin-bottom:6px}
  .cd-cross{margin-top:8px}
  .cd-tools{margin:8px 0 10px}
  .lm-card.is-cmp .cd-body{-webkit-line-clamp:1}
  .lm-card.is-cmp .cd-cross{display:none}
  .cd-cmp{margin-top:8px;padding:8px 10px}
  /* the compare controls stay on one row and scroll sideways, like the Cross to chips, instead of spilling under the sheet's nav */
  .cd-cmp .row{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:-10px;padding-right:10px}
  .cd-cmp .row::-webkit-scrollbar,.cd-cross::-webkit-scrollbar{display:none}
  .cd-cmp .row .chip{flex:0 0 auto}
  .cd-cross{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
  .cd-cross .chip{flex:0 0 auto;min-height:36px}
  .cd-nav button,.cd-nav a{height:48px;letter-spacing:.12em}
  .cd-nav .cd-play{flex:0 0 86px}
  .cd-tools .chip{min-height:36px}
  .picker{left:0;right:0;width:auto;top:auto;bottom:var(--tab-h);max-height:72vh;border-left:0;border-right:0;box-shadow:0 -8px 0 rgba(0,0,0,.4)}
  .rd-wrap{padding-top:44px}
  .rd-h .sw{width:30px;height:10px;margin-right:10px}
  .rd-arc{font-size:17.5px}
  .rd-eras{grid-template-columns:repeat(5,1fr)}
  .rd-eras div{padding-bottom:8px}
  .rd-m{grid-template-columns:minmax(0,1fr);padding:9px 4px 9px 44px}
  .rd-m .y{padding:0}
  .rd-m .mt{grid-column:1}
  .rd-ledger{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
  .rd-nextprev{grid-template-columns:1fr 1fr}
  .rd-nextprev .mid{grid-column:1 / -1;order:3;justify-self:center}
  .rd-nextprev .np b{font-size:19px}
  .rd-cmp{padding:20px 16px 22px}
  .rd-cmp .cm-grid{grid-template-columns:repeat(5,1fr);row-gap:14px}
  .rd-cmp .cm-bars{height:60px}
  .rd-cmp .cm-col span b{display:none}
  .rd-ribbon .tk{stroke-width:.6px;stroke-opacity:.55}
  .rd-ribbon .tk-a{stroke-width:1.2px}
  /* touch targets: at least 40px tall on phones */
  .cd-cross .chip,.cd-tools .chip,.cd-cmp .row .chip,.rd-tagacts .chip,.cd-thread{min-height:40px}
  .rd-tags button,.rd-ppl a,.rd-rel .cmpb,.rd-more{min-height:40px}
  .rd-rel .cmpb{height:40px}
  .rd-pairs button,.rd-led li button{min-height:40px}
  .rd-pods .ln{gap:0 18px;flex-wrap:wrap}
  .rd-pods .ln a{display:inline-flex;align-items:center;min-height:40px;padding-bottom:0;border-bottom:0;text-decoration:underline;text-decoration-color:rgba(1,16,21,.3);text-underline-offset:5px}
  .rd-pods .ln a.is-lr{text-decoration-color:var(--lr-orange)}
  /* inline links in running text and lists: taller hit areas without moving the lines */
  .rd-arc a,.rd-m .tt a,.cd-title a,.rd-cmp ol a{padding:10px 0}
  .rd-rel .nm button{min-height:40px}
}
@media (prefers-reduced-motion:reduce){
  .lm-cue i{animation:none}
  .era,.lm-card,.lm-title,.cd-anim,.lm-legend,.lm-fkeys,.lm-era-note,.lm-note,.lm-tip,.cd-print canvas{transition-duration:.01s!important;transition-delay:0s!important;animation:none!important}
  .lm-card.is-play .cd-prog::after{animation:none;width:100%;opacity:.45}
}