/* BJ Research · the timeline as a list in space: the page is the time axis (months sized by
   their days, cards by content, native scroll); a starfield that travels with the scroll, a glass
   instrument strip, glowing rails that converge down the spine. Loaded beside tl-page.css. */
:root{--navh:52px;--pxday:6px;--spine:200px;--striph:104px;--slot:clamp(2.6rem,13vh,7.5rem)}
.tl-page{scroll-padding-top:calc(var(--navh) + 1rem)}
.tll-sky{position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 90% 60% at 50% -12%,var(--space-3) 0%,var(--space-2) 38%,var(--space) 100%)}
.tll-sky::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse 50% 40% at 50% 110%,rgba(30,64,175,.22),transparent 70%)}
#tll-stars{position:fixed;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
/* main is a stacking context: the fixed sky and stars (z -1) paint above the page background and below every
   in-flow child; the site nav keeps research.css's fixed placement and sits above main */
.tl-page .tl-main,.tl-page .footer{position:relative;z-index:1}
.tl-listmode{padding-top:var(--navh)}
/* ---------- intro ---------- */
.tll-intro{padding:6.6rem 0 2.8rem;border-bottom:1px solid var(--hard)}
.tll-intro .s-label{color:var(--sec)}.tll-intro .s-label .n{color:var(--accent)}
.tll-intro h1{font-size:var(--t-5);font-weight:900;letter-spacing:-.03em;line-height:.98;margin:1rem 0 1rem;color:#fff}
.tll-intro h1 em{font-style:italic;font-weight:600;color:var(--accent)}
.tll-intro .lede{font-size:var(--t-1);color:var(--body);max-width:60ch;line-height:1.5;margin-bottom:1rem}
.tll-scale{font-family:var(--sans);font-size:var(--t--2);color:var(--sec);max-width:72ch;line-height:1.55;margin-bottom:1.6rem}
.tll-intro-links{display:flex;gap:.6rem;flex-wrap:wrap}
.tll-intro-links .more-btn{color:#fff;border-color:#fff}
.tll-intro-links .more-btn:hover{background:#fff;color:#05070e}
.tll-intro-links .more-btn.ghost{border-color:var(--hard);color:var(--body)}
.tll-intro-links .more-btn.ghost:hover{background:rgba(255,255,255,.08);color:#fff;border-color:#fff}

/* ---------- layout ---------- */
.tll-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:0 2rem;align-items:start;padding-top:1.5rem}
.tll-strip{position:sticky;top:var(--navh);height:calc(100svh - var(--navh));overflow:hidden;display:flex;flex-direction:column;gap:1rem;padding:1.2rem 1rem 1rem 0;border-right:1px solid var(--border)}
.tll-body{position:relative;display:grid;grid-template-columns:var(--spine) minmax(0,620px);gap:0 1.6rem}
.tll-rails{position:absolute;top:0;left:0;width:var(--spine);height:100%;overflow:visible;pointer-events:none}
.tl-list{list-style:none;grid-column:1/3;position:relative}
.tl-end{grid-column:2;padding:3rem 0 5rem;font-size:var(--t-0);color:var(--sec);max-width:56ch}
.tl-end a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

/* ---------- instruments (HUD) ---------- */
.tll-date{font-family:var(--serif);font-size:clamp(2rem,2.6vw,2.6rem);font-weight:800;letter-spacing:-.03em;line-height:1;color:#fff;display:flex;flex-direction:column;gap:.3rem;min-height:3.2rem;text-shadow:0 0 24px rgba(91,141,239,.35)}
.tll-date-pre{font-family:var(--sans);font-size:var(--t--2);font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);min-height:1em;text-shadow:none}
.tll-date time{font-variant-numeric:tabular-nums}
.tll-axis{position:relative;height:2.6rem;cursor:pointer;outline-offset:6px;border-radius:2px;touch-action:none}
.tll-axis-track{position:absolute;left:0;right:0;top:.95rem;height:3px;background:rgba(140,160,210,.22);border-radius:2px;overflow:visible}
.tll-axis-past{position:absolute;left:0;top:0;bottom:0;width:0;background:var(--accent);box-shadow:0 0 10px var(--glow);border-radius:2px}
.tll-axis-future{position:absolute;right:0;top:0;bottom:0;width:22%;background:repeating-linear-gradient(90deg,rgba(169,198,255,.5) 0 3px,transparent 3px 7px)}
.tll-axis-ticks{position:absolute;left:0;right:0;top:1.45rem;font-family:var(--mono);font-size:.62rem;color:var(--sec)}
.tll-axis-ticks span{position:absolute;transform:translateX(-50%);white-space:nowrap}
.tll-axis-ticks span::before{content:"";position:absolute;left:50%;top:-.5rem;width:1px;height:.35rem;background:var(--hard)}
.tll-axis-ticks span.ahead{color:var(--muted)}
.tll-playhead{position:absolute;top:.5rem;left:0;width:2px;height:1.05rem;background:#fff;transform:translateX(-1px);will-change:transform;box-shadow:0 0 8px #fff}
.tll-playhead::after{content:"";position:absolute;left:-4px;top:-5px;width:10px;height:10px;border-radius:50%;background:#fff;border:2px solid var(--space);box-shadow:0 0 12px var(--glow)}
.tll-xsec{display:none}
.tll-counters{display:grid;grid-template-columns:1fr 1fr;gap:.5rem .9rem;margin:0}
.tll-counters .ct{border-top:1px solid var(--border);padding-top:.45rem}
.tll-counters dt{font-family:var(--sans);font-size:.62rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sec);line-height:1.3}
.tll-counters dd{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:var(--t-2);font-weight:500;color:#fff;letter-spacing:-.02em;line-height:1.1;margin:.1rem 0 0}
.tll-counters .ct.L1 dd{color:var(--L1)}.tll-counters .ct.L2 dd{color:var(--L2)}.tll-counters .ct.L3 dd{color:var(--L3)}.tll-counters .ct.REG dd{color:var(--REG)}
.tll-controls{display:flex;gap:.4rem;flex-wrap:wrap}
.tl-btn{font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.06em;color:#e8edf7;border:1px solid var(--hard);background:rgba(10,15,30,.6);padding:.45rem .7rem;border-radius:2px;min-width:2.4rem;transition:border-color .15s,background .15s}
.tl-btn:hover{border-color:#fff}
.tl-btn[aria-pressed="true"]{background:#f1f4f9;color:#05070e;border-color:#f1f4f9}
.tll-filters{font-family:var(--sans);font-size:var(--t--2)}
.tll-filters summary{cursor:pointer;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--sec);padding:.3rem 0}
.tll-filters .chips{margin:.5rem 0}
.tl-page .chip{background:transparent;color:#aab4c8;border-color:var(--hard);padding:.32rem .55rem;font-size:.62rem}
.tl-page .chip:hover{color:#fff;border-color:#fff}
.tl-page .chip[aria-pressed="true"]{background:#f1f4f9;color:#05070e;border-color:#f1f4f9}
.tll-minimap{margin-top:auto;display:grid;grid-template-columns:8px 1fr;gap:.7rem;align-items:stretch;min-height:120px}
.mm-track{position:relative;background:rgba(140,160,210,.1);border:1px solid var(--border);border-radius:2px;cursor:pointer}
.mm-thumb{position:absolute;left:-1px;right:-1px;top:0;height:8%;background:var(--accent);border-radius:2px;box-shadow:0 0 10px var(--glow);will-change:transform}
.mm-links{display:flex;flex-direction:column;justify-content:space-between;font-family:var(--mono);font-size:.68rem}
.mm-links a{color:var(--sec);padding:.15rem 0}
.mm-links a:hover,.mm-links a.on{color:#fff}
.tll-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html:not(.js) .tll-filters,html:not(.js) .tll-controls,html:not(.js) .tll-minimap .mm-track{display:none}

/* ---------- chapters, months ---------- */
.tl-chapter{grid-column:1/3;padding:3.4rem 0 1rem;border-top:1px solid var(--hard);margin-top:2.2rem;position:relative}
.tl-chapter::before{content:"";position:absolute;left:0;right:0;top:-1px;height:1px;background:linear-gradient(90deg,var(--accent),transparent 60%);opacity:.7}
.tl-chapter h2{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-left:calc(var(--spine) + 1.6rem)}
.ch-year{font-family:var(--serif);font-size:var(--t-4);font-weight:900;letter-spacing:-.03em;line-height:1;color:#fff;text-shadow:0 0 30px rgba(91,141,239,.35)}
.ch-sub{font-family:var(--sans);font-size:var(--t--1);font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--accent)}
.tl-chapter.future{border-top-style:dashed}
.tl-month{display:grid;grid-template-columns:var(--spine) minmax(0,620px);gap:0 1.6rem;padding-top:calc(var(--days) * var(--pxday));position:relative}
.tl-month.future{--pxday:1.5px}
.tl-month > h3{grid-column:2;font-family:var(--sans);font-size:var(--t--2);font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--sec);display:flex;justify-content:space-between;align-items:baseline;padding:.4rem 0;border-bottom:1px solid var(--border);margin-bottom:.9rem}
.tl-month > h3 time{color:#e8edf7}
.tl-month.empty > h3{color:var(--muted);border-bottom-style:dotted}
.tl-month.empty > h3 time{color:var(--sec)}
.m-count{font-family:var(--mono);font-weight:500;letter-spacing:0;text-transform:none;color:var(--muted)}
.tl-cards{list-style:none;grid-column:2;display:flex;flex-direction:column;gap:var(--slot);padding-bottom:var(--slot)}

/* ---------- cards (glass panels) ---------- */
.tl-card{position:relative;background:var(--card);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--border);border-left:3px solid var(--hard);border-radius:3px;padding:1.1rem 1.3rem 1.1rem;display:flex;flex-direction:column;gap:.45rem;scroll-margin-top:calc(var(--navh) + 20vh);box-shadow:0 10px 40px rgba(0,0,0,.35)}
.tl-card.L1{border-left-color:var(--L1)}.tl-card.L2{border-left-color:var(--L2)}.tl-card.L3{border-left-color:var(--L3)}.tl-card.REG{border-left-color:var(--REG)}.tl-card.MACRO{border-left-color:var(--muted)}
.tl-card.prediction{border-style:dashed;border-color:rgba(169,198,255,.4);background:rgba(10,15,30,.35);box-shadow:none}
.tl-card.note{background:rgba(91,141,239,.08)}
.tl-card.author{border-left-style:double;border-left-width:5px}
.tl-card.is-now{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 0 30px rgba(91,141,239,.35),0 10px 40px rgba(0,0,0,.35)}
.tl-card:target{outline:2px solid var(--accent);outline-offset:4px}
.tl-card:focus-visible{outline:2px solid #fff;outline-offset:4px}
.c-kick{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;font-family:var(--sans);font-size:.64rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--sec)}
.k-layer{color:var(--L1)}.tl-card.L2 .k-layer{color:var(--L2)}.tl-card.L3 .k-layer{color:var(--L3)}.tl-card.REG .k-layer{color:var(--REG)}
.k-actor{color:#e8edf7}
.k-sec{font-family:var(--mono);color:var(--sec);border:1px solid var(--hard);padding:.06rem .4rem;border-radius:2px;letter-spacing:0;text-transform:none;font-weight:500;text-decoration:none}
.k-sec:hover{color:#fff;border-color:#fff}
.k-pred{color:var(--L2);border:1px dashed rgba(169,198,255,.5);padding:.08rem .45rem;border-radius:2px}
.k-author{color:#fff;border:1px solid rgba(255,255,255,.6);padding:.08rem .45rem;border-radius:2px}
.tl-card > time{font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:var(--t--1);color:#e8edf7}
.tl-card h4{font-size:var(--t-1);line-height:1.25;letter-spacing:-.01em;text-wrap:balance;color:#fff}
.tl-card h4 a{color:#fff;text-decoration:underline;text-decoration-color:transparent;text-underline-offset:3px}
.tl-card h4 a:hover{text-decoration-color:var(--accent-line)}
.tl-card p{color:var(--body);font-size:var(--t--1);line-height:1.55;max-width:64ch}
.c-links{display:flex;gap:1.2rem;flex-wrap:wrap;margin-top:auto;padding-top:.4rem;font-family:var(--sans);font-size:var(--t--2);font-weight:600}
.c-src{color:var(--sec)}.c-src:hover{color:#fff}
.c-read{color:var(--accent)}
.c-note{display:grid;grid-template-columns:auto 1fr auto;gap:.8rem;align-items:center;margin-top:.3rem;padding:.55rem .8rem;border:1px solid var(--hard);border-left:3px solid var(--accent);background:rgba(91,141,239,.08);border-radius:2px;font-family:var(--sans)}
.c-note:hover{border-color:var(--accent)}
.c-note-k{font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);white-space:nowrap}
.c-note-t{font-family:var(--serif);font-size:var(--t--1);font-weight:600;color:#fff;line-height:1.3}
.c-note-r{font-size:.66rem;font-weight:600;color:var(--accent);white-space:nowrap}
.tl-card.stub{min-height:0;padding:.45rem .9rem;gap:0;opacity:.5;background:transparent;border-color:var(--border);border-left-width:3px;box-shadow:none;backdrop-filter:none}
.tl-card.stub .c-kick,.tl-card.stub p,.tl-card.stub .c-note,.tl-card.stub .c-links{display:none}
.tl-card.stub > time{font-size:.68rem;color:var(--sec)}
.tl-card.stub h4{font-size:var(--t--1);font-weight:600}

/* ---------- today + ahead ---------- */
.tl-today{grid-column:1/3;margin:3rem 0 1rem;padding:1.8rem 0 1.3rem;border-top:2px solid #fff;border-bottom:1px solid var(--hard);position:relative}
.tl-today::before{content:"";position:absolute;left:0;right:0;top:-2px;height:2px;background:#fff;box-shadow:0 0 18px #fff,0 0 40px var(--glow)}
.tl-today h2{display:flex;align-items:baseline;gap:1rem;flex-wrap:wrap;margin-left:calc(var(--spine) + 1.6rem)}
.tl-today .ch-year{color:#fff}
.tl-today time{font-family:var(--mono);font-size:var(--t-0);color:var(--accent)}
.tl-today p{font-size:var(--t--1);color:var(--sec);max-width:60ch;margin-top:.5rem;margin-left:calc(var(--spine) + 1.6rem)}
.tl-list .future ~ .future,.tl-chapter.future{background:repeating-linear-gradient(135deg,transparent 0 11px,var(--hatch) 11px 12px)}

/* ---------- arrival from depth ---------- */
@supports (animation-timeline: view()){
  .js.sda .tl-list .tl-card:not(.stub){animation:tl-arrive linear both;animation-timeline:view();animation-range:entry 0% entry 50%}
  @keyframes tl-arrive{from{opacity:0;transform:translateY(56px) scale(.93)}to{opacity:1;transform:none}}
}
.js:not(.sda) .tl-list .tl-card:not(.stub){opacity:0;transform:translateY(40px) scale(.95);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1)}
.js:not(.sda) .tl-list .tl-card.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .js .tl-card,.js.sda .tl-card{animation:none!important;opacity:1!important;transform:none!important;transition:none!important}
  .tl-page{scroll-behavior:auto}
  .tll-date,.ch-year{text-shadow:none}
}

/* ---------- help dialog ---------- */
.tll-helpdlg{position:fixed;inset:0;margin:auto;width:min(30rem,calc(100vw - 2rem));max-height:min(90svh,46rem);overflow:auto;border:1px solid var(--hard);border-radius:3px;padding:1.6rem 1.8rem;max-width:30rem;background:#0a0f1e;color:var(--body);font-family:var(--sans)}
.tll-helpdlg::backdrop{background:rgba(5,7,14,.7)}
.tll-helpdlg h2{font-family:var(--serif);font-size:var(--t-1);margin-bottom:1rem;color:#fff}
.tll-helpdlg dl div{display:grid;grid-template-columns:7rem 1fr;gap:.8rem;padding:.4rem 0;border-top:1px solid var(--border);font-size:var(--t--1)}
.tll-helpdlg dt{font-family:var(--mono);color:#fff;font-weight:600}
.tll-helpdlg form{margin-top:1rem;text-align:right}

/* ---------- no-JS spine ---------- */
html:not(.js) .tl-list::before{content:"";position:absolute;left:calc(var(--spine) / 2);top:0;bottom:0;width:2px;background:var(--hard)}
html:not(.js) .tll-rails,html:not(.js) #tll-stars{display:none}

/* ---------- mobile ---------- */
@media(max-width:899px){
  :root{--pxday:3px;--spine:28px;--slot:1.6rem}
  .tll-layout{display:block;padding-top:0}
  .tll-strip{position:sticky;top:var(--navh);height:auto;overflow:visible;z-index:20;background:rgba(5,7,14,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-right:0;border-bottom:1px solid var(--hard);padding:.55rem var(--gutter) 2.3rem;gap:.3rem;margin:0 calc(-1 * var(--gutter)) 1rem;display:flex;flex-direction:column}
  .tll-body{margin-top:.5rem}
  .tl-chapter h2,.tl-today h2,.tl-today p{margin-left:calc(var(--spine) + .9rem)}
  .tll-date{flex-direction:row;align-items:baseline;gap:.6rem;font-size:1.35rem;min-height:0}
  .tll-date-pre{min-height:0}
  .tll-axis{height:2.2rem}
  .tll-axis-ticks{top:1.3rem}
  .tll-xsec{display:flex;align-items:center;gap:0;position:absolute;right:var(--gutter);top:.55rem;height:1.4rem;width:60px}
  .xs{position:absolute;top:50%;width:9px;height:9px;border-radius:50%;transform:translate(-50%,-50%);left:50%;will-change:transform;box-shadow:0 0 8px var(--glow)}
  .xs.L1{background:var(--L1)}.xs.L2{background:transparent;border:2px solid var(--L2)}.xs.L3{background:var(--L3)}
  .tll-counters{grid-template-columns:repeat(4,auto);gap:.2rem .7rem;justify-content:start;position:absolute;left:var(--gutter);bottom:.6rem}
  .tll-counters .ct{border-top:0;padding-top:0;display:flex;gap:.3rem;align-items:baseline}
  .tll-counters dt{font-size:.6rem;font-family:var(--mono);letter-spacing:0}
  .tll-counters .ct-w{display:none}
  .tll-counters dd{font-size:var(--t--1)}
  .btn-w{display:none}
  .tll-controls{position:absolute;right:var(--gutter);bottom:.4rem;gap:.25rem}
  .tl-btn{padding:.3rem .5rem;font-size:.62rem;min-width:0}
  .tll-filters,.tll-minimap{display:none!important}
  .tll-body{grid-template-columns:var(--spine) minmax(0,1fr);gap:0 .9rem}
  .tl-month{grid-template-columns:var(--spine) minmax(0,1fr);gap:0 .9rem}
  .tl-card{min-height:0;padding:.9rem 1rem;scroll-margin-top:calc(var(--navh) + var(--striph) + 1rem);backdrop-filter:none;-webkit-backdrop-filter:none;background:rgba(10,15,30,.9)}
  .c-note{grid-template-columns:1fr;gap:.2rem}
  .tll-intro{padding-top:5rem}
  .tl-end{grid-column:1/3}
}
@media(min-width:900px) and (max-width:1100px){.tll-layout{grid-template-columns:230px minmax(0,1fr)}:root{--spine:140px}}
@media print{.tll-strip,.tll-rails,.tll-helpdlg,#tll-stars,.tll-sky{display:none!important}body.tl-page{background:#fff;color:#000}.tl-card{break-inside:avoid;min-height:0;background:#fff;color:#000}.tl-card h4,.tl-card p,.ch-year{color:#000!important;text-shadow:none}}

.tll-helpdlg h3{font-family:var(--sans);font-size:.66rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--sec);margin:1.3rem 0 .5rem}