/*!
 * PAGELLA v2 — the bright, friendly visual system for neuro-net.net / safelyspace.org.
 * Phosphor's daytime sibling: newsprint paper, espresso ink, one highlighter.
 *
 * Use:
 *   <link rel="stylesheet" href="https://neuro-net.net/pagella/pagella.css?v=2">
 *   <script src="https://neuro-net.net/pagella/pagella.js?v=2" defer></script>
 *   <body class="pg"> ... </body>
 *
 * Fonts are loaded here, so one <link> is all a page needs.
 * Bump ?v= when this file changes: nginx serves css/js with a one-year cache.
 */
@import url("https://fonts.googleapis.com/css2?family=UnifrakturMaguntia&family=Playfair+Display:ital,wght@0,600;0,800;0,900;1,600&family=Source+Serif+4:ital,opsz,wght@0,8..60,400;0,8..60,600;1,8..60,400&family=Libre+Franklin:wght@500;700&display=swap");

/* ============ 1. Tokens ============ */
:root{
  color-scheme: light;
  /* paper */
  --pg-paper:      #faf6ee;  /* ground: bright newsprint */
  --pg-paper-2:    #f2ebdd;  /* boxed items, wells */
  /* ink */
  --pg-ink:        #2b1d14;  /* headlines, rules: espresso */
  --pg-ink-2:      #4f3e31;  /* body copy */
  --pg-muted:      #8a7461;  /* bylines, captions, meta */
  --pg-rule:       #2b1d14;  /* hard rules */
  --pg-rule-soft:  #dccfb8;  /* column + dotted rules */
  /* accents */
  --pg-red:        #a4321e;  /* rubric: kickers, drop caps, focus. never errors */
  --pg-hl:         rgba(255,206,84,.62);  /* THE loud one: highlighter yellow */
  --pg-hl-red:     rgba(222,94,72,.26);   /* rare second marker, one per page */
  /* type */
  --pg-serif: 'Source Serif 4', Georgia, 'Times New Roman', serif;
  --pg-head:  'Playfair Display', Georgia, serif;
  --pg-black: 'UnifrakturMaguntia', 'Playfair Display', serif;
  --pg-sans:  'Libre Franklin', 'Helvetica Neue', Arial, sans-serif;
  /* space + shape */
  --pg-s1:4px; --pg-s2:8px; --pg-s3:12px; --pg-s4:16px; --pg-s5:24px; --pg-s6:32px; --pg-s7:56px;
  --pg-radius: 4px;          /* friendly, but only on things you can press */
  --pg-max: 1180px;
  --pg-ease: cubic-bezier(.65,.05,.25,1);
}

/* ============ 2. Base ============ */
.pg, .pg *{box-sizing:border-box}
.pg{
  margin:0;background:var(--pg-paper);color:var(--pg-ink-2);
  font:17px/1.62 var(--pg-serif);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.pg :where(h1,h2,h3,h4,p,ul,ol,figure,blockquote){margin:0}
.pg :where(ul,ol){padding:0}
.pg :where(a){color:inherit}   /* :where keeps it from beating component colors */
.pg :focus-visible{outline:2px solid var(--pg-red);outline-offset:3px;border-radius:2px}
.pg ::selection{background:var(--pg-hl);color:var(--pg-ink)}
/* opt-in paper grain. Off by default: clean first */
.pg.pg-grain::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.45;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .35  0 0 0 0 .25  0 0 0 0 .15  0 0 0 .08 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ 3. Layout ============ */
.pg-page{position:relative;z-index:1;max-width:var(--pg-max);margin:0 auto;padding:0 var(--pg-s6) var(--pg-s7)}
.pg-grid{display:grid;grid-template-columns:repeat(var(--pg-cols,3),minmax(0,1fr))}
.pg-grid > *{padding:0 var(--pg-s5);border-right:1px solid var(--pg-rule-soft)}
.pg-grid > :first-child{padding-left:0}
.pg-grid > :last-child{padding-right:0;border-right:0}
.pg-columns{columns:2;column-gap:var(--pg-s6);column-rule:1px solid var(--pg-rule-soft)}
.pg-columns p + p{margin-top:var(--pg-s3);text-indent:1.4em}

/* ============ 4. Type ============ */
.pg-mast{font:400 clamp(46px,9.4vw,118px)/1 var(--pg-black);color:var(--pg-ink);text-align:center}
.pg-mast--plain{font:900 clamp(40px,8vw,96px)/1 var(--pg-head);letter-spacing:-.02em}
.pg-motto{font:italic 15px/1.4 var(--pg-serif);color:var(--pg-muted);text-align:center;margin-top:var(--pg-s2)}
.pg-h1,.pg-h2,.pg-h3,.pg-h4{font-family:var(--pg-head);color:var(--pg-ink);line-height:1.08}
.pg-h1{font-size:clamp(34px,5vw,58px);font-weight:900;letter-spacing:-.01em}
.pg-h2{font-size:clamp(26px,3.4vw,36px);font-weight:800}
.pg-h3{font-size:28px;font-weight:800}
.pg-h4{font-size:20px;font-weight:900;text-transform:uppercase;letter-spacing:.02em}
.pg-deck{font:italic 600 21px/1.4 var(--pg-head);color:var(--pg-ink-2);margin-top:var(--pg-s3)}
.pg-kicker{font:700 11px/1.3 var(--pg-sans);letter-spacing:.18em;text-transform:uppercase;color:var(--pg-red);margin-bottom:var(--pg-s2)}
.pg-byline{font:500 12px/1.4 var(--pg-sans);letter-spacing:.06em;text-transform:uppercase;color:var(--pg-muted);margin:var(--pg-s2) 0 var(--pg-s4)}
.pg-label{font:700 11px/1.3 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink)}
.pg-meta{font:600 11px/1.4 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-muted)}
.pg-drop::first-letter{float:left;font:900 4.4em/.82 var(--pg-head);color:var(--pg-red);padding:6px 10px 0 0}
.pg-caption{font:italic 14px/1.45 var(--pg-serif);color:var(--pg-muted);margin-top:var(--pg-s2)}

/* ============ 5. Rules + section heads ============ */
.pg-rule{border:0;border-top:1px solid var(--pg-rule);margin:0}
.pg-rule--soft{border-top-color:var(--pg-rule-soft)}
.pg-rule--double{border-top:4px double var(--pg-rule)}
.pg-section{
  display:flex;align-items:center;gap:var(--pg-s4);margin:var(--pg-s7) 0 var(--pg-s5);
  font:700 12px/1 var(--pg-sans);letter-spacing:.24em;text-transform:uppercase;color:var(--pg-ink);
}
.pg-section::before,.pg-section::after{content:"";flex:1;border-top:1px solid var(--pg-rule)}
.pg-dateline{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:var(--pg-s3);
  border-top:1px solid var(--pg-rule);border-bottom:4px double var(--pg-rule);
  padding:var(--pg-s2) 0;margin-top:var(--pg-s3);
}
.pg-dateline > *{font:700 11px/1.3 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink)}
.pg-dateline > :last-child{text-align:right}

/* ============ 6. Top strip + footer ============ */
.pg-strip{
  display:flex;justify-content:space-between;align-items:center;gap:var(--pg-s4);flex-wrap:wrap;
  padding:var(--pg-s3) 0 var(--pg-s2);border-bottom:3px solid var(--pg-rule);
}
.pg-strip, .pg-strip a{font:600 11px/1.4 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-muted);text-decoration:none}
.pg-strip nav{display:flex;gap:22px}
.pg-strip a:hover{color:var(--pg-red)}
.pg-foot{
  margin-top:var(--pg-s7);border-top:4px double var(--pg-rule);padding-top:var(--pg-s3);
  display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--pg-s3);
}
.pg-foot, .pg-foot a{font:600 11px/1.5 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-muted);text-decoration:none}
.pg-foot a:hover, .pg-foot a[aria-current]{color:var(--pg-ink)}

/* ============ 7. Highlighter (needs pagella.js to sweep) ============ */
.pg-hl{
  color:var(--pg-ink);
  background-image:linear-gradient(100deg, transparent 0 1%, var(--pg-hl) 3% 95%, transparent 99%);
  background-repeat:no-repeat;background-size:100% 78%;background-position:0 70%;
  padding:0 .12em;margin:0 -.06em;
  -webkit-box-decoration-break:clone;box-decoration-break:clone;
  transition:background-size 1.1s var(--pg-ease);
}
/* without JS the marks are simply drawn; pagella.js adds .pg-js and sweeps them in */
.pg-js .pg-hl{background-size:0% 78%}
.pg-js .pg-hl.is-on{background-size:100% 78%}
.pg-hl--red{--pg-hl:var(--pg-hl-red)}

/* ============ 8. Controls ============ */
.pg-link{
  display:inline-flex;align-items:center;gap:var(--pg-s2);
  font:700 12px/1 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;color:var(--pg-ink);
  text-decoration:none;border-bottom:2px solid currentColor;padding-bottom:4px;
  transition:color .2s, gap .2s;
}
.pg-link:hover{color:var(--pg-red);gap:var(--pg-s3)}
.pg-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--pg-s2);
  height:44px;padding:0 var(--pg-s5);border:1.5px solid var(--pg-ink);border-radius:var(--pg-radius);
  background:transparent;color:var(--pg-ink);cursor:pointer;text-decoration:none;
  font:700 12px/1 var(--pg-sans);letter-spacing:.14em;text-transform:uppercase;
  transition:background .2s, color .2s, transform .1s;
}
.pg-btn:hover{background:var(--pg-paper-2)}
.pg-btn:active{transform:translateY(1px)}
.pg-btn--ink{background:var(--pg-ink);color:var(--pg-paper)}
.pg-btn--ink:hover{background:var(--pg-red);border-color:var(--pg-red)}
.pg-switch{display:inline-flex;border:1px solid var(--pg-ink);border-radius:var(--pg-radius);overflow:hidden}
.pg-switch button{
  font:700 11px/1 var(--pg-sans);letter-spacing:.12em;padding:5px 9px;border:0;cursor:pointer;
  background:transparent;color:var(--pg-ink);
}
.pg-switch button[aria-pressed="true"]{background:var(--pg-ink);color:var(--pg-paper)}
.pg-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--pg-s3)}
.pg-tag{font:500 11px/1 var(--pg-sans);letter-spacing:.06em;border:1px solid var(--pg-rule-soft);border-radius:var(--pg-radius);padding:6px 8px;color:var(--pg-ink-2);background:var(--pg-paper-2)}

/* ============ 9. Boxes ============ */
.pg-box{border:1px solid var(--pg-rule);background:var(--pg-paper-2);padding:var(--pg-s4) var(--pg-s4) 18px}
.pg-box--double{border:3px double var(--pg-rule);background:transparent;padding:20px 22px}
.pg-ad{display:flex;flex-direction:column}
.pg-ad .pg-h4{border-bottom:1px solid var(--pg-rule);padding-bottom:var(--pg-s2);margin-bottom:10px}
.pg-ad p{font-size:15px;line-height:1.5}
.pg-ad .pg-where{margin-top:auto;padding-top:var(--pg-s3);font:500 12px/1.3 var(--pg-sans);color:var(--pg-muted)}
.pg-ad .pg-where a{color:var(--pg-ink);text-decoration:none;border-bottom:1px solid var(--pg-rule-soft)}
.pg-ad .pg-where a:hover{color:var(--pg-red);border-color:var(--pg-red)}
.pg-figure{border:1px solid var(--pg-rule);background:var(--pg-paper-2);aspect-ratio:4/3;display:grid;place-items:center;overflow:hidden}
.pg-facts{list-style:none;font-size:15px}
.pg-facts li{display:flex;justify-content:space-between;gap:var(--pg-s3);padding:7px 0;border-bottom:1px dotted var(--pg-rule-soft)}
.pg-facts b{font:700 11px/1.9 var(--pg-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--pg-ink)}
.pg-quote{max-width:860px;margin:var(--pg-s7) auto 0;text-align:center;border-top:1px solid var(--pg-rule);border-bottom:1px solid var(--pg-rule);padding:30px 12px}
.pg-quote p{font:italic 600 clamp(24px,3.4vw,36px)/1.3 var(--pg-head);color:var(--pg-ink)}
.pg-quote small{display:block;margin-top:var(--pg-s3);font:700 11px/1 var(--pg-sans);letter-spacing:.2em;text-transform:uppercase;color:var(--pg-muted)}
.pg-list{list-style:none;counter-reset:pg}
.pg-list li{counter-increment:pg;display:grid;grid-template-columns:28px 1fr;padding:10px 0;border-top:1px dotted var(--pg-rule-soft);font-size:15px}
.pg-list li::before{content:counter(pg,upper-roman)".";font:700 15px var(--pg-head);color:var(--pg-red)}
.pg-list b{color:var(--pg-ink)}

/* ============ 11. Print texture (opt-in: <body class="pg pg-print">) ============
   Grain, paper fibers, specks, foxing, a center fold and aged edges.
   Everything sits behind the text and ignores the pointer. */
.pg.pg-print{
  position:relative;isolation:isolate;overflow-x:clip;
  background-color:var(--pg-paper);
  background-image:
    linear-gradient(90deg, transparent calc(50% - 46px), rgba(90,60,30,.045) calc(50% - 3px), rgba(255,253,246,.55) calc(50% - 1px), rgba(90,60,30,.07) calc(50% + 1px), transparent calc(50% + 40px)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1100' height='1400'%3E %3Cdefs%3E%3Cfilter id='d' x='-20%25' y='-20%25' width='140%25' height='140%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.018' numOctaves='3' seed='9'/%3E %3CfeDisplacementMap in='SourceGraphic' scale='70'/%3E%3CfeGaussianBlur stdDeviation='5'/%3E%3C/filter%3E %3CradialGradient id='g'%3E%3Cstop offset='0' stop-color='%23a0703a' stop-opacity='.11'/%3E%3Cstop offset='.6' stop-color='%23a0703a' stop-opacity='.05'/%3E %3Cstop offset='1' stop-color='%23a0703a' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Cg filter='url(%23d)'%3E%3Cellipse cx='723' cy='833' rx='109' ry='92' fill='url(%23g)' opacity='0.73'/%3E%3Cellipse cx='454' cy='449' rx='115' ry='95' fill='url(%23g)' opacity='0.80'/%3E%3Cellipse cx='450' cy='356' rx='107' ry='73' fill='url(%23g)' opacity='0.53'/%3E%3Cellipse cx='811' cy='1089' rx='138' ry='40' fill='url(%23g)' opacity='0.78'/%3E%3Cellipse cx='665' cy='723' rx='133' ry='55' fill='url(%23g)' opacity='0.79'/%3E%3Cellipse cx='801' cy='324' rx='57' ry='39' fill='url(%23g)' opacity='0.55'/%3E%3Cellipse cx='507' cy='874' rx='53' ry='94' fill='url(%23g)' opacity='0.63'/%3E%3Cellipse cx='460' cy='791' rx='79' ry='72' fill='url(%23g)' opacity='0.72'/%3E%3C/g%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520'%3E%3Ccircle cx='518.8' cy='517.8' r='1.7' fill='%232b1d14' opacity='0.21'/%3E%3Ccircle cx='132.1' cy='394.2' r='1' fill='%232b1d14' opacity='0.29'/%3E%3Ccircle cx='36.5' cy='398.5' r='0.8' fill='%232b1d14' opacity='0.22'/%3E%3Ccircle cx='151.3' cy='34.7' r='0.5' fill='%232b1d14' opacity='0.49'/%3E%3Ccircle cx='0.3' cy='109.1' r='0.5' fill='%232b1d14' opacity='0.35'/%3E%3Ccircle cx='509.8' cy='206.7' r='0.5' fill='%232b1d14' opacity='0.39'/%3E%3Ccircle cx='103.2' cy='351.0' r='0.7' fill='%232b1d14' opacity='0.21'/%3E%3Ccircle cx='172.9' cy='501.3' r='1.7' fill='%232b1d14' opacity='0.52'/%3E%3Ccircle cx='70.0' cy='367.6' r='0.5' fill='%232b1d14' opacity='0.20'/%3E%3Ccircle cx='414.5' cy='92.4' r='1' fill='%232b1d14' opacity='0.25'/%3E%3Ccircle cx='264.6' cy='512.3' r='1.7' fill='%232b1d14' opacity='0.23'/%3E%3Ccircle cx='334.7' cy='60.6' r='0.8' fill='%232b1d14' opacity='0.55'/%3E%3Ccircle cx='0.2' cy='449.5' r='1.7' fill='%232b1d14' opacity='0.40'/%3E%3Ccircle cx='518.9' cy='10.2' r='0.6' fill='%232b1d14' opacity='0.33'/%3E%3Ccircle cx='444.3' cy='333.8' r='0.5' fill='%232b1d14' opacity='0.20'/%3E%3Ccircle cx='76.1' cy='229.6' r='0.5' fill='%232b1d14' opacity='0.47'/%3E%3Ccircle cx='171.1' cy='154.1' r='0.5' fill='%232b1d14' opacity='0.21'/%3E%3Ccircle cx='108.5' cy='331.0' r='0.5' fill='%232b1d14' opacity='0.40'/%3E%3Ccircle cx='193.3' cy='235.7' r='1' fill='%232b1d14' opacity='0.36'/%3E%3Ccircle cx='298.8' cy='450.6' r='0.6' fill='%232b1d14' opacity='0.41'/%3E%3Ccircle cx='161.6' cy='118.8' r='1' fill='%232b1d14' opacity='0.27'/%3E%3Ccircle cx='98.7' cy='384.5' r='1' fill='%232b1d14' opacity='0.25'/%3E%3Ccircle cx='494.1' cy='458.7' r='1' fill='%232b1d14' opacity='0.21'/%3E%3Ccircle cx='24.6' cy='56.7' r='1' fill='%232b1d14' opacity='0.54'/%3E%3Ccircle cx='124.0' cy='366.4' r='0.7' fill='%232b1d14' opacity='0.34'/%3E%3Ccircle cx='470.5' cy='255.3' r='1' fill='%232b1d14' opacity='0.24'/%3E%3Ccircle cx='374.6' cy='35.8' r='0.8' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='249.2' cy='339.8' r='1.6' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='319.4' cy='145.7' r='0.8' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='389.5' cy='36.0' r='1.2' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='231.8' cy='31.4' r='0.8' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='146.6' cy='276.1' r='0.8' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='47.9' cy='72.0' r='1.2' fill='%23fffdf6' opacity='.8'/%3E%3Ccircle cx='509.9' cy='341.6' r='1.6' fill='%23fffdf6' opacity='.8'/%3E%3Cpath d='M261 473q7 -3 15 -2' stroke='%232b1d14' stroke-width='.5' fill='none' opacity='.25'/%3E%3Cpath d='M295 462q8 0 13 -1' stroke='%232b1d14' stroke-width='.5' fill='none' opacity='.25'/%3E%3Cpath d='M237 179q3 -3 15 2' stroke='%232b1d14' stroke-width='.5' fill='none' opacity='.25'/%3E%3Cpath d='M156 17q5 -4 10 0' stroke='%232b1d14' stroke-width='.5' fill='none' opacity='.25'/%3E%3C/svg%3E");
  background-size:100% 100%, 1100px 1400px, 520px 520px;
  background-position:0 0, 0 0, 37px 61px;
}
.pg.pg-print::before{       /* grain + fibers: fixed, so it never repeats visibly */
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E %3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' seed='3' stitchTiles='stitch'/%3E %3CfeColorMatrix values='0 0 0 0 .30 0 0 0 0 .21 0 0 0 0 .12 0 0 0 .16 0'/%3E%3C/filter%3E %3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.008 .35' numOctaves='2' seed='5' stitchTiles='stitch'/%3E %3CfeColorMatrix values='0 0 0 0 .40 0 0 0 0 .30 0 0 0 0 .18 0 0 0 .10 -.02'/%3E%3C/filter%3E %3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;opacity:.9;
}
.pg.pg-print::after{        /* aged, slightly yellowed edges */
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  background:
    radial-gradient(ellipse 120% 90% at 50% 45%, transparent 62%, rgba(176,128,62,.10) 88%, rgba(140,96,44,.18) 100%),
    linear-gradient(180deg, rgba(176,128,62,.05), transparent 12%, transparent 88%, rgba(176,128,62,.06));
}
.pg-print .pg-box, .pg-print .pg-figure, .pg-print .pg-tag{background-color:rgba(232,220,198,.45)}
.pg-stain{                   /* a coffee ring; place it with top/left on the element */
  position:absolute;width:var(--pg-stain-size,230px);aspect-ratio:1;pointer-events:none;z-index:0;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 300'%3E %3Cdefs%3E%3Cfilter id='r' x='-10%25' y='-10%25' width='120%25' height='120%25'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.035' numOctaves='3' seed='4'/%3E %3CfeDisplacementMap in='SourceGraphic' scale='9'/%3E%3C/filter%3E %3Cfilter id='s'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.05' numOctaves='2' seed='8'/%3E%3CfeDisplacementMap in='SourceGraphic' scale='22'/%3E%3CfeGaussianBlur stdDeviation='3'/%3E%3C/filter%3E%3C/defs%3E %3Ccircle cx='150' cy='150' r='112' fill='%238a5a2b' opacity='.045' filter='url(%23s)'/%3E %3Cg filter='url(%23r)' fill='none' stroke='%237a4a20'%3E %3Ccircle cx='150' cy='150' r='118' stroke-width='5' opacity='.20' stroke-dasharray='520 30 90 60'/%3E %3Ccircle cx='150' cy='150' r='114' stroke-width='2' opacity='.16'/%3E %3Ccircle cx='152' cy='147' r='121' stroke-width='1.2' opacity='.12' stroke-dasharray='200 120'/%3E%3C/g%3E %3Ccircle cx='262' cy='96' r='5' fill='%237a4a20' opacity='.10' filter='url(%23s)'/%3E%3Ccircle cx='275' cy='120' r='2.5' fill='%237a4a20' opacity='.12'/%3E%3C/svg%3E") center/contain no-repeat;
  mix-blend-mode:multiply;transform:rotate(var(--pg-stain-turn,-14deg));
}
@media print{ .pg.pg-print, .pg.pg-print::before, .pg.pg-print::after, .pg-stain{background:none!important} }

/* ============ 10. Responsive + motion ============ */
@media (max-width:980px){
  .pg-grid{grid-template-columns:1fr}
  .pg-grid > *{padding:0 0 var(--pg-s5);margin-bottom:var(--pg-s5);border-right:0;border-bottom:1px solid var(--pg-rule-soft)}
  .pg-grid > :last-child{border-bottom:0;margin-bottom:0;padding-bottom:0}
}
@media (max-width:640px){
  .pg{font-size:16px}
  .pg-page{padding:0 var(--pg-s4) 48px}
  .pg-columns{columns:1}
  .pg-strip nav{display:none}
  .pg-dateline{grid-template-columns:1fr;text-align:center}
  .pg-dateline > :last-child{text-align:center}
}
@media (prefers-reduced-motion:reduce){
  .pg-hl, .pg-js .pg-hl{transition:none;background-size:100% 78%}
  .pg-btn,.pg-link{transition:none}
}