/* ============================================================
   Writing — editorial long-form styles (whatcounts.in/writing)
   Shares the book site's palette and self-hosted STIX Two Text.
   ============================================================ */

@font-face{font-family:'STIX Two Text';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/stix-two-text-latin-400-normal.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'STIX Two Text';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/stix-two-text-latin-ext-400-normal.woff2') format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'STIX Two Text';font-style:normal;font-weight:500;font-display:swap;src:url('/fonts/stix-two-text-latin-500-normal.woff2') format('woff2')}
@font-face{font-family:'STIX Two Text';font-style:normal;font-weight:600;font-display:swap;src:url('/fonts/stix-two-text-latin-600-normal.woff2') format('woff2')}
@font-face{font-family:'STIX Two Text';font-style:normal;font-weight:700;font-display:swap;src:url('/fonts/stix-two-text-latin-700-normal.woff2') format('woff2')}
@font-face{font-family:'STIX Two Text';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/stix-two-text-latin-400-italic.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'STIX Two Text';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/stix-two-text-latin-ext-400-italic.woff2') format('woff2');unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'STIX Two Text';font-style:italic;font-weight:600;font-display:swap;src:url('/fonts/stix-two-text-latin-600-italic.woff2') format('woff2')}

:root{
  --ink:#14140f;--grey:#43423c;--faint:#767676;--rule:#14140f;--link:#1A3E6E;
  --desk:#F3F1EA;--sheet:#FFFFFF;--hair:#9a988f;--hair-faint:#e2e0d7;--accent:#8a2b1f;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ink:#e9e7e0;--grey:#b3b1a9;--faint:#8b8a85;--rule:#c8c7c1;--link:#8fb3e6;
    --desk:#141416;--sheet:#1b1b1d;--hair:#54534d;--hair-faint:#33322e;--accent:#e08a7a;
  }
}
:root[data-theme="dark"]{
  --ink:#e9e7e0;--grey:#b3b1a9;--faint:#8b8a85;--rule:#c8c7c1;--link:#8fb3e6;
  --desk:#141416;--sheet:#1b1b1d;--hair:#54534d;--hair-faint:#33322e;--accent:#e08a7a;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{
  background:var(--desk);color:var(--ink);
  font-family:'STIX Two Text','Times New Roman',Times,serif;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
a{color:var(--link);text-decoration:none}
a:hover{text-decoration:underline}
a:focus-visible{outline:2px solid var(--link);outline-offset:2px}

/* reading progress */
.progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--accent);z-index:95}
@media (prefers-reduced-motion: no-preference){.progress{transition:width .08s linear}}

/* masthead / back link */
.masthead{
  display:inline-block;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;
  font-weight:600;color:var(--faint);text-decoration:none;
}
.masthead:hover{color:var(--link);text-decoration:none}

/* ---------------- ARTICLE ---------------- */
.article{max-width:44rem;margin:0 auto;padding:34px 24px 90px}
.art-head{margin:14px 0 8px;text-align:left}
.art-head .kicker{
  font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;
  color:var(--accent);margin:22px 0 12px;
}
.art-head h1{
  font-size:clamp(2rem,5vw,3rem);font-weight:700;line-height:1.08;letter-spacing:-.008em;
  margin:0 0 16px;
}
.art-head .dek{
  font-size:clamp(1.15rem,2.5vw,1.42rem);font-style:italic;line-height:1.4;color:var(--grey);
  max-width:34ch;margin:0 0 22px;
}
.art-head .byline{
  font-size:.9rem;color:var(--faint);letter-spacing:.01em;
  padding-bottom:22px;border-bottom:1px solid var(--hair-faint);
}
.art-head .byline time{white-space:nowrap}

/* body */
.art-body{font-size:1.19rem;line-height:1.68}
.art-body > p{margin:0 0 1.15em}
.art-body > p:first-of-type::first-letter{
  float:left;font-size:3.4em;line-height:.82;font-weight:700;
  padding:.02em .09em 0 0;color:var(--ink);
}
.art-body h2{
  font-size:1.5rem;font-weight:700;line-height:1.2;margin:1.9em 0 .5em;letter-spacing:-.005em;
}
.art-body h3{font-size:1.18rem;font-weight:600;font-style:italic;margin:1.6em 0 .4em}
.art-body a{text-decoration:underline;text-underline-offset:2px;text-decoration-thickness:.055em;text-decoration-color:var(--hair)}
.art-body a:hover{text-decoration-color:var(--link)}
.art-body strong{font-weight:700}
.art-body em{font-style:italic}
.art-body ul,.art-body ol{margin:0 0 1.15em 1.3em}
.art-body li{margin:0 0 .4em}
.art-body hr{border:none;border-top:1px solid var(--hair-faint);margin:2.2em auto;width:30%}

/* pull quote */
.art-body blockquote{
  margin:1.6em 0;padding:.1em 0 .1em 1.1em;border-left:3px solid var(--accent);
  font-size:1.34rem;line-height:1.4;font-style:italic;color:var(--ink);
}
.art-body blockquote p{margin:0}

/* figures (charts) — allowed to break wider than the text measure */
.figure{margin:2.2em 0;text-align:center}
.figure.wide{width:min(58rem,92vw);margin-left:50%;transform:translateX(-50%)}
.figure svg{width:100%;height:auto;display:block;font-family:inherit;overflow:visible}
.figure figcaption{
  margin-top:12px;font-size:.86rem;line-height:1.5;color:var(--grey);text-align:left;
  max-width:44rem;margin-left:auto;margin-right:auto;
}
.figure figcaption b{color:var(--ink);font-weight:700}
.figure figcaption .src{display:block;margin-top:3px;font-size:.8rem;color:var(--faint);font-style:italic}

/* chart primitives */
.ch-grid{stroke:var(--hair-faint);stroke-width:1}
.ch-axis{stroke:var(--rule);stroke-width:1}
.ch-tick{stroke:var(--hair);stroke-width:1}
.ch-lbl{fill:var(--faint);font-size:10px}
.ch-line{fill:none;stroke:var(--accent);stroke-width:1.8}
.ch-dot{fill:var(--accent)}
.ch-val{fill:var(--ink);font-size:10px;font-weight:600}
.ch-c{text-anchor:middle}.ch-e{text-anchor:end}
/* second series (grey), third series (dotted, faint) */
.ch-line2{fill:none;stroke:var(--grey);stroke-width:1.8}
.ch-dot2{fill:var(--grey)}
.ch-line3{fill:none;stroke:var(--hair);stroke-width:1.6;stroke-dasharray:4 3}
.ch-dot3{fill:var(--hair)}
.ch-key3{fill:var(--hair)}
/* unmeasured / broken stretches, drawn dotted */
.ch-gap{fill:none;stroke:var(--hair);stroke-width:1.6;stroke-dasharray:2 4}
/* bars */
.ch-bar{fill:var(--hair)}
.ch-bar-a{fill:var(--accent)}
/* in-chart annotations */
.ch-note{fill:var(--faint);font-size:10px;font-style:italic}
/* grouped-bar sub-labels */
.ch-sub{fill:var(--faint);font-size:8px}

/* footnotes */
.art-body sup a{text-decoration:none;font-size:.7em;color:var(--link);padding:0 .1em}
.footnotes{margin-top:2.6em;padding-top:1.1em;border-top:1px solid var(--hair-faint);font-size:.92rem;line-height:1.5;color:var(--grey)}
.footnotes ol{margin:0 0 0 1.2em}
.footnotes li{margin:0 0 .5em}

/* article footer */
.art-foot{margin-top:3em;padding-top:1.3em;border-top:1px solid var(--rule);font-size:.95rem;color:var(--grey)}
.art-foot .art-bio{margin:0 0 12px;line-height:1.55}
.art-foot .art-bio b{color:var(--ink)}
.art-foot .art-nav{font-size:.9rem}

/* ---------------- INDEX ---------------- */
.wlist{max-width:46rem;margin:0 auto;padding:34px 24px 90px}
.wlist-head{margin:18px 0 6px;padding-bottom:24px;border-bottom:1.5px solid var(--rule)}
.wlist-head h1{font-size:clamp(2.2rem,6vw,3.2rem);font-weight:700;letter-spacing:-.01em;line-height:1.05;margin:14px 0 12px}
.wlist-head .dek{font-size:1.2rem;font-style:italic;color:var(--grey);line-height:1.4;max-width:40ch}
.wlist-items{list-style:none;margin:0;padding:0}
.wlist-item{padding:28px 0;border-bottom:1px solid var(--hair-faint)}
.wlist-item .kicker{display:block;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:600;color:var(--accent);margin-bottom:8px}
.wlist-item h2{font-size:1.7rem;font-weight:700;line-height:1.15;letter-spacing:-.006em;margin:0 0 6px}
.wlist-item h2 a{color:var(--ink)}
.wlist-item h2 a:hover{color:var(--link)}
.wlist-item .dek{font-size:1.08rem;font-style:italic;color:var(--grey);line-height:1.4;margin:0 0 8px;max-width:52ch}
.wlist-item .byline{font-size:.85rem;color:var(--faint)}

@media (max-width:640px){
  .article,.wlist{padding-left:20px;padding-right:20px}
  .art-body{font-size:1.12rem}
  .figure.wide{width:100%;margin-left:0;transform:none}
}

/* print */
@media print{
  .progress,.masthead,.art-foot .art-nav{display:none}
  body{background:#fff;color:#000}
  .article{max-width:none}
}

.wlist-soon{margin-top:34px;font-size:1.08rem;font-style:italic;color:var(--faint)}