@font-face{font-family:'AmpDisplay';src:url(data:font/woff2;base64,d09GMgABAAAAAAOwAA8AAAAABugAAANZAAEz+AAAAAAAAAAAAAAAAAAAAAAAAAAAGyAcKgZgP1NUQVREADQRCAqCcIJdATYCJAMICwYABCAFhRwHIAwHG8sFKJ4DbssM68omW2hmc0aRrhgeTQ3F8/zv922f++9gpk1MMotqydNYQtJfHaLFiVgkSjOpkzF7x6/75u0HcTRDuq0XjQwiAQpZnn4/9zZPiou0L2oJPEFoFgrXyW1d2Njb7uBy/Pj4YBsn6NMj3j+NVTS2jz1AxgINozig/IETCigNiNNsszGr+TEmkQ+5SGQMoTwVDDGNGtqxfXgJsio0DSAYYgFTGHRd7hyk8qAWRTyuZUwaoINyA7stb7+5BdzkJKiMI5XHz9l1YheAXgsYV/emg3oV/iBQSnmCWQgiBikYB8M82BWCVGM4fRFiYxHVOASUDE8blMdAhERAQQvjEATjEM0CqipY0DQiat4J6HHckRExqq29jjvQk1C27Qgf/fP0553RRJcpd3cvXy38XRpD0cmeL/zshJ573ffkIIqGxt05xsv2hJ6+I9evM82f97W1rOeZJJeGJPdXwLQDuGjvTM8t2eGHnsfBRfFfS+p5cX5qlwoYfuFes3CuvAFA8uIikZO//+Emik4vIWX8SU/pDS/eP5zNaUDfXctp4QcN4rf9+jDV8v3j3cld5eb1qT0tjPziT8WKVmH142wmqMIIf+ptq4i9PRw1I0kTo7ydqTVSavV6TXu1MxXdYCnXl5mZvXesWwi7pvjjNMPxDLehglPde4HrjKOtPX1jpb5Q9wJZuK1ZoLmRYWTHRe3SY3s7i9SkTbsnNjW0385aX3QtzN39Ly3orB/uZ1m5+tuYGBeqASDI2p8P53dU5HA2fMu2Wv3wsvkCB4APTnvy32apxiSeKwYoIHwcrRNB/3XR7xf9QClreLbsGEMorhuorUNoc0swRJftqIPJPMBMzIohUwzLDqZlS44w1Yo0MB2mZJUeYFmuWGFYqYEIe5EMN6KMEkAgssgoBJKqlT1bdlxoJSJhWsViQSw4CEXWKhBFIboqBlIqoGGQIG/8aFQkgUzRylQplUqkmGfDRgmKvrMGNqyAgDOiAAuiUWAIBIxMMTKH1FBlH0taeHCqVTxsw2S6jhIRTMCXtooG4ZbbTM+HtbMGiT0qqJSCGGNdIuHAQ/DWXQt9WF8YCpkscbGV7euSTGrBQKsZppecuIH9AbU8sKaW+SZZguYzzU3jaPH9lOkjvgE=) format('woff2');font-style:italic;font-weight:400;font-display:swap}
:root{
  --ink:#0F0F0F;--ink-2:#1A1A1A;--slate:#3A3F44;--text-2:#B7B7B7;--muted:#8C8C8C;
  --surface:#161616;--card:#1b1c1e;--line:#2b2d30;--paper:#F4F4F4;
  --gold:#F5C400;--gold-ink:#705700;--copper:#B87333;--oxblood:#7A2E2A;--verdigris:#3E7A6E;--bruise:#4A3F55;
  --sans:-apple-system,"Segoe UI",Inter,Roboto,Helvetica,Arial,sans-serif;
  --serif:"Newsreader","Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --bg:var(--ink);--fg:var(--paper);--fg-dim:var(--text-2);--panel:var(--card);--hair:var(--line);--eyebrow:var(--copper);
}
:root[data-theme="light"]{--bg:#FBFAF7;--fg:#0F0F0F;--fg-dim:#4a4a4a;--panel:#fff;--hair:#e6e2d9;--eyebrow:var(--gold-ink);}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}
.wrap{max-width:1080px;margin:0 auto;padding:0 1.4rem}
.eyebrow{letter-spacing:.2em;text-transform:uppercase;font-size:.72rem;font-weight:600;color:var(--eyebrow)}

nav.top{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 0;gap:1rem;flex-wrap:wrap}
nav.top .brand{font-family:var(--serif);font-size:1.05rem;font-weight:600}
nav.top .navlinks{display:flex;gap:1.4rem;font-size:.86rem;color:var(--fg-dim)}
nav.top .navlinks a:hover,nav.top .navlinks a[aria-current]{color:var(--fg)}

.hero{padding:16vh 0 12vh}
.hero .rule{width:64px;height:2px;background:var(--gold);margin:1.4rem 0}
h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.6rem,7vw,5rem);line-height:1.03;letter-spacing:-.02em;margin:.4rem 0 0}
.hero .intent{font-size:clamp(1.05rem,2.2vw,1.3rem);color:var(--fg-dim);max-width:36ch;margin:1.4rem 0 0}

section{padding:6vh 0;border-top:1px solid var(--hair)}
.sec-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.sec-more{font-size:.82rem;color:var(--fg-dim)}.sec-more:hover{color:var(--fg)}
.sec-title{font-family:var(--serif);font-weight:600;font-size:clamp(1.7rem,4vw,2.4rem);letter-spacing:-.01em;margin:0}
.sec-lede{color:var(--fg-dim);max-width:60ch;margin:.7rem 0 1.6rem}

.teasers{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.1rem}
.teaser{background:var(--panel);border:1px solid var(--hair);border-radius:16px;transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .3s}
.teaser:hover{transform:translateY(-3px);border-color:var(--copper)}
.teaser-link{display:block;padding:1.5rem 1.5rem}
.teaser-date{font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.teaser h3{font-family:var(--serif);font-weight:600;font-size:1.4rem;margin:.5rem 0 .5rem}
.teaser p{color:var(--fg-dim);font-size:.96rem;margin:0}
.teaser .points{list-style:none;margin:0;padding:0;color:var(--fg-dim);font-size:.92rem;display:grid;gap:.36rem}
.teaser .points li{padding-left:1.05rem;position:relative}
.teaser .points li::before{content:"";position:absolute;left:0;top:.6em;width:.32rem;height:.32rem;border-radius:50%;background:var(--copper)}
.go{display:inline-block;margin-top:1rem;font-size:.8rem;letter-spacing:.06em;text-transform:uppercase;color:var(--copper);font-weight:600}

.novels{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.1rem}
.novel{background:var(--panel);border:1px solid var(--hair);border-left:3px solid var(--oxblood);border-radius:16px;padding:1.5rem}
.novel-meta{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;margin-bottom:.4rem}
.book-no{font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--oxblood)}
.book-status{font-size:.72rem;color:var(--muted)}
.novel h3{font-family:var(--serif);font-weight:600;font-size:1.35rem;font-style:italic;margin:.2rem 0 .5rem}
.novel p{color:var(--fg-dim);font-size:.96rem;margin:0}
.novel.featured{grid-column:1/-1}
.novel.featured h3{font-size:1.6rem}
.novel-tbc{color:var(--muted);font-style:italic}

.btn-line{display:inline-block;font-size:.85rem;letter-spacing:.04em;color:var(--gold);border-bottom:1px solid var(--gold);padding-bottom:2px}

/* writing index */
.page-head{padding:12vh 0 3vh}
.page-head h1{font-size:clamp(2.4rem,6vw,4rem)}
.page-lede{color:var(--fg-dim);max-width:52ch;margin:1rem 0 0}
.post-list{border-top:1px solid var(--hair)}
.post-row{display:grid;grid-template-columns:8rem 1fr;gap:.2rem 1.4rem;padding:1.5rem 0;border-bottom:1px solid var(--hair);align-items:baseline}
.post-row:hover .post-title{color:var(--gold)}
.post-date{font-size:.8rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.post-title{font-family:var(--serif);font-size:1.5rem;font-weight:600;grid-column:2}
.post-excerpt{grid-column:2;color:var(--fg-dim);font-size:.95rem}
/* Advisory index: what the bulletin covers, as points rather than a truncated opener. */
.post-points{grid-column:2;list-style:none;margin:.35rem 0 0;padding:0;color:var(--fg-dim);font-size:.95rem;display:grid;gap:.3rem}
.post-points li{padding-left:1.1rem;position:relative}
.post-points li::before{content:"";position:absolute;left:0;top:.62em;width:.34rem;height:.34rem;border-radius:50%;background:var(--copper)}
.post-row[hidden]{display:none}
/* writing filter chips (general vs project musings) */
.post-filter{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;margin:.4rem 0 0}
.post-filter .flabel{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-right:.1rem}
.filter-chip{font-family:var(--sans);font-size:.8rem;color:var(--fg);background:var(--panel);border:1px solid var(--hair);border-radius:999px;padding:.32rem .82rem;cursor:pointer;transition:color .2s,border-color .2s,opacity .2s}
.filter-chip:hover{border-color:var(--copper)}
.filter-chip[aria-pressed="true"]{border-color:var(--copper)}
.filter-chip[aria-pressed="false"]{color:var(--muted);opacity:.5}
.post-empty{color:var(--muted);font-size:.95rem;padding:1.5rem 0}

/* single post */
.post{max-width:44rem;margin:0 auto;padding:8vh 0 4vh}
.back{font-size:.85rem;color:var(--fg-dim)}.back:hover{color:var(--fg)}
.post-header{margin:1.4rem 0 2.4rem;border-bottom:1px solid var(--hair);padding-bottom:1.6rem}
.post-header h1{font-size:clamp(2.2rem,5vw,3.4rem);margin:.6rem 0 0}
.post-hero{margin:0 0 2.4rem}
.post-hero img{display:block;width:100%;height:auto;border-radius:10px;border:1px solid var(--hair)}
.prose{font-family:var(--serif);font-size:1.16rem;line-height:1.75}
.prose h2{font-family:var(--serif);font-size:1.5rem;font-weight:600;margin:2.4rem 0 .8rem;letter-spacing:-.01em}
.prose h3{font-family:var(--serif);font-size:1.2rem;font-weight:600;margin:2rem 0 .6rem}
.prose p{margin:1.1rem 0}
.prose a{color:var(--gold);border-bottom:1px solid color-mix(in srgb,var(--gold) 40%,transparent)}
.prose a:hover{border-bottom-color:var(--gold)}
/* Bright gold reads poorly on a light page, and worst of all inside the gold-tinted
   bulletin blocks — light mode drops to the deep gold ink instead. */
:root[data-theme="light"] .prose a{color:var(--gold-ink);border-bottom-color:color-mix(in srgb,var(--gold-ink) 45%,transparent)}
:root[data-theme="light"] .prose a:hover{border-bottom-color:var(--gold-ink)}
.prose em{font-style:italic}.prose strong{font-weight:700;color:var(--fg)}
.prose code{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:.9em}
.prose :not(pre)>code{background:var(--panel);border:1px solid var(--hair);border-radius:5px;padding:.06em .38em}
.prose pre.code{background:#0c0d0f;border:1px solid #23252a;border-radius:10px;padding:1rem 1.15rem;margin:1.5rem 0;overflow-x:auto}
.prose pre.code code{white-space:pre;color:#e9e7e1;font-size:.85rem;line-height:1.6;border:0;background:none;padding:0}
/* syntax highlighting — palette-tuned, dark panel in both site themes */
.hljs-comment,.hljs-quote{color:#7c8590;font-style:italic}
.hljs-keyword,.hljs-selector-tag,.hljs-literal,.hljs-doctag,.hljs-section,.hljs-meta .hljs-keyword{color:#F5C400}
.hljs-string,.hljs-regexp,.hljs-addition,.hljs-meta .hljs-string{color:#7fb9a6}
.hljs-number,.hljs-symbol,.hljs-bullet,.hljs-link{color:#e0975a}
.hljs-title,.hljs-title.function_,.hljs-name{color:#eef0f2;font-weight:600}
.hljs-built_in,.hljs-type,.hljs-title.class_,.hljs-class .hljs-title{color:#c98a52}
.hljs-attr,.hljs-attribute,.hljs-variable,.hljs-template-variable,.hljs-property{color:#c3aede}
.hljs-params{color:#cfd2d6}
.hljs-meta{color:#7c8590}
.hljs-deletion{color:#e06c6c}
.hljs-emphasis{font-style:italic}.hljs-strong{font-weight:700}
/* theme toggle button */
.navright{display:flex;align-items:center;gap:.5rem}
.theme-toggle{background:none;border:1px solid var(--hair);border-radius:999px;width:34px;height:34px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;color:var(--fg-dim);padding:0;flex:none}
.theme-toggle:hover{color:var(--fg);border-color:var(--copper)}
.theme-toggle svg{width:16px;height:16px;display:none}
.theme-toggle .icon-sun{display:block}
:root[data-theme="light"] .theme-toggle .icon-sun{display:none}
:root[data-theme="light"] .theme-toggle .icon-moon{display:block}
.prose blockquote{margin:1.4rem 0;padding-left:1.2rem;border-left:2px solid var(--copper);color:var(--fg-dim);font-style:italic}
.prose ul{margin:1.1rem 0;padding-left:1.3rem}.prose li{margin:.3rem 0}
.prose ul ul{margin:.55rem 0 .9rem;padding-left:0}

/* Advisory bulletins — shaded blocks carried over from the branded email edition, so a
   long issue reads as sections rather than one unbroken column. */
.b-tag{display:block;font-size:.67rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--copper);margin-bottom:.35rem}
.bulletin .b-take{display:flex;gap:1.4rem;align-items:flex-start;background:var(--panel);border:1px solid var(--hair);border-left:3px solid var(--copper);border-radius:14px;padding:1.5rem 1.6rem;margin:1.8rem 0}
/* The portrait is a transparent cut-out (made for the email's dark band), so it carries its
   own disc — on a light panel it would otherwise float as a hard silhouette. */
.b-portrait{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 18%;flex:0 0 auto;
  background:radial-gradient(circle at 50% 32%,#33363b,#191a1d);filter:grayscale(88%) contrast(1.04);
  border:1px solid var(--hair);box-shadow:0 1px 10px rgba(0,0,0,.22)}
.b-take-body{flex:1 1 auto;min-width:0}
.bulletin .b-take p{margin:0}
.bulletin .b-read{background:rgba(245,196,0,.06);border-left:3px solid var(--gold);border-radius:14px;padding:1.25rem 1.5rem;margin:1.7rem 0}
.bulletin .b-read p{margin:0}
.bulletin .b-signal{list-style:none;background:rgba(184,115,51,.11);border-radius:10px;padding:.8rem 1.05rem;margin:.55rem 0}
.bulletin .b-signal .b-tag{color:var(--gold);margin-bottom:.2rem}
.bulletin .b-cta{display:block;background:var(--panel);border:1px solid var(--hair);border-top:3px solid var(--gold);border-radius:14px;padding:1.5rem 1.7rem;margin:2.2rem 0 0}
.bulletin .b-cta h2{margin-top:0}
.bulletin .b-cta ul{list-style:none;padding-left:0}
.bulletin .b-cta li{padding-left:1.15rem;position:relative;margin:.7rem 0}
.bulletin .b-cta li::before{content:"";position:absolute;left:0;top:.62em;width:.36rem;height:.36rem;border-radius:50%;background:var(--gold)}
.bulletin .b-cta p:last-of-type a{display:inline-block;border:1px solid var(--copper);border-radius:999px;padding:.42rem 1rem;margin:.3rem .4rem .1rem 0;font-size:.88rem;color:var(--fg)}
.bulletin .b-cta p:last-of-type a:hover{background:var(--copper);color:var(--paper)}
.b-note{color:var(--muted);font-size:.84rem;font-style:italic;margin-top:1.6rem;padding-top:1.1rem;border-top:1px solid var(--hair)}
@media(max-width:560px){.bulletin .b-take{flex-direction:column;gap:1rem}.b-portrait{width:72px;height:72px}}
:root[data-theme="light"] .bulletin .b-read{background:rgba(245,196,0,.10)}
:root[data-theme="light"] .bulletin .b-signal{background:rgba(184,115,51,.10)}
.prose hr{border:0;border-top:1px solid var(--hair);margin:2rem 0}
.post-foot{margin-top:3rem;padding-top:1.6rem;border-top:1px solid var(--hair)}

/* project page */
.project .post-header{border-bottom:0;padding-bottom:0;margin-bottom:1.6rem}
.project-summary{font-family:var(--sans);font-size:1.1rem;color:var(--fg-dim);max-width:60ch;margin:.9rem 0 0;line-height:1.55}
.cta-row{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.4rem 0 0}
.btn-cta{display:inline-block;font-size:.9rem;font-weight:600;padding:.6rem 1rem;border-radius:10px;border:1px solid var(--hair);background:var(--panel);color:var(--fg)}
.btn-cta:hover{border-color:var(--copper)}
.btn-cta.primary{background:var(--gold);color:#000;border-color:var(--gold)}
.btn-cta.primary:hover{filter:brightness(1.06)}
.lang-block{margin:.4rem 0 1.2rem;padding:1.2rem 0 0}
.lang-label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--copper)}
.lang-grid{display:flex;flex-wrap:wrap;gap:.4rem;margin:.7rem 0 0}
.lang{font-family:var(--sans);font-size:.8rem;color:var(--fg-dim);background:var(--panel);border:1px solid var(--hair);border-radius:6px;padding:.22rem .55rem}
.lang-note{font-family:var(--sans);font-size:.9rem;color:var(--fg-dim);margin:.9rem 0 0}
.lang-note a{color:var(--gold);border-bottom:1px solid color-mix(in srgb,var(--gold) 40%,transparent)}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

footer{border-top:1px solid var(--hair);padding:3rem 0 4rem;color:var(--muted);font-size:.85rem;display:flex;flex-wrap:wrap;gap:1.2rem;justify-content:space-between;align-items:center}
footer a{color:var(--fg-dim)}footer a:hover{color:var(--fg)}
@media(max-width:560px){.post-row{grid-template-columns:1fr}.post-title,.post-excerpt{grid-column:1}}

/* whimsy — a giant italic ampersand watermark (Geth loves the &) */
body::before{content:"&";position:fixed;right:-.06em;bottom:-.2em;z-index:-1;
  font-family:'AmpDisplay',Baskerville,"Baskerville Old Face","Hoefler Text",Didot,Garamond,Georgia,serif;
  font-style:italic;font-weight:400;font-size:74vh;line-height:.8;color:var(--copper);opacity:.07;
  pointer-events:none;user-select:none}

/* whimsy — random bees */
#bee-layer{position:fixed;inset:0;overflow:hidden;pointer-events:none;z-index:60}
.bee{position:absolute;top:0;left:0;will-change:transform}
.bee .wing{transform-origin:50% 60%;animation:flutter .12s infinite alternate ease-in-out}
.bee .wing.w2{animation-delay:.06s}
@keyframes flutter{from{transform:scaleY(1)}to{transform:scaleY(.5)}}
@media(prefers-reduced-motion:reduce){#bee-layer{display:none}}
