/* Local LLM Field Notes — the working notebook theme (Direction A).
   Paper/ink, serif headings (Newsreader incl. opsz axis), mono accents (IBM Plex Mono),
   Caveat handwriting for kickers, and a terminal whisper in the footer. No dark-mode GitHub. */
:root{
  --paper:#f7f3ea; --paper2:#e7dec6; --ink:#231e18; --iron:#5a534a;
  --mut:#675d4f; --ruling:#a6977c; --ruling-soft:#cfc3a8; --acc:#9a1f1f;
  --quote:#6e675b; --mono-font:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --serif-font:"Newsreader",Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
::selection{background:var(--acc);color:var(--paper)}
html{background:var(--paper2)}
body{margin:0;background:var(--paper);color:var(--ink);font:400 17px/1.75 var(--serif-font);font-optical-sizing:auto;font-feature-settings:"onum" 1;-webkit-font-smoothing:antialiased;position:relative}
/* paper grain — pure-CSS feTurbulence data-URI, no assets, no JS (Direction A) */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;
  background-image:url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/><feColorMatrix values='0 0 0 0 0.25 0 0 0 0 0.21 0 0 0 0 0.14 0 0 0 0 0.06 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>")}
a{color:var(--acc);text-decoration:none;border-bottom:1px solid transparent} a:hover{border-bottom-color:currentColor}
/* ---- notebook shell / ring binder ---- */
.notebook{max-width:980px;margin:0 auto;position:relative;background:var(--paper);border:1px solid #d9cdb2;box-shadow:0 1px 2px rgba(58,48,32,.12),0 16px 40px rgba(58,48,32,.14)}
/* fixed-pitch punched holes + wire — one element, no child markup, kept on mobile */
.binding{position:absolute;left:8px;top:0;bottom:0;width:26px;opacity:1;z-index:0;
  background:
    radial-gradient(circle 5px at 13px 20px, var(--paper2) 4px, #8f8268 4.5px 6px, transparent 6.5px),
    repeating-linear-gradient(180deg, var(--ruling) 0 2px, transparent 2px 56px);
  background-size:26px 56px,2px 56px;background-position:0 0,13px 0;background-repeat:repeat-y}
.wrap{max-width:760px;margin:0 auto;padding:0 28px 0 40px}
/* ---- header: top of the notebook ---- */
.site-head{border-bottom:2px solid var(--ruling);position:relative;background:linear-gradient(var(--paper),var(--paper2));z-index:1}
.site-head::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:6px;background:repeating-linear-gradient(90deg,var(--ruling-soft) 0 2px,transparent 2px 14px) center/14px 2px no-repeat}
.site-head .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.ruled{color:var(--ruling);font-family:var(--mono-font);margin-right:12px;letter-spacing:2px}
.brand{font-family:var(--serif-font);font-weight:700;font-style:italic;font-size:26px;color:var(--ink);letter-spacing:.2px}
.brand:hover{color:var(--acc)}
nav a{margin-left:16px;font-family:var(--mono-font);font-size:14px;color:var(--mut);border-bottom:none}
nav a.on{color:var(--acc);border-bottom:1px dotted var(--acc)}
nav a:hover{color:var(--ink);border-bottom:1px dotted var(--ink)}
nav a.nav-cta{background:var(--ink);color:#eae3d3;padding:6px 14px;border:1px solid var(--ink);font-weight:500}
nav a.nav-cta:hover{color:#fff;border-bottom:1px solid var(--ink);background:#1f1a14}
/* ---- main / index ---- */
.main{padding:38px 28px 48px;z-index:1;position:relative}
.kicker{font-family:"Caveat",cursive;font-size:24px;line-height:1.2;color:var(--acc);margin:0 0 10px} .kicker .mono{font-family:var(--mono-font);font-size:15px;letter-spacing:.4px;color:var(--acc)}
h1.lede{font-family:var(--serif-font);font-size:54px;line-height:1.1;font-weight:700;letter-spacing:-1px;margin:0 0 18px}
.main>h1,.post-title{font-size:44px;line-height:1.12;letter-spacing:-.5px;margin:0 0 12px;font-weight:700}
p.sub{color:var(--iron);font-size:20px;margin:0 0 14px}
.index-note{display:flex;gap:12px;margin:26px 0 8px;padding:16px 18px;background:var(--paper2);border:1px solid var(--ruling-soft);border-left:3px solid var(--ruling);font-family:var(--mono-font);font-size:14px;color:var(--iron)}
.index-note .note-mark{font-size:18px;line-height:1.4}
.index-note p{margin:0}
.mono{font-family:var(--mono-font)}
h2.rule{font-family:var(--serif-font);font-size:22px;font-weight:600;margin:38px 0 16px;padding-bottom:8px;border-bottom:1px solid var(--ruling)}
h2.rule .mono{font-size:15px;color:var(--acc);font-weight:500;letter-spacing:1px}
h1,h2,h3{font-family:var(--serif-font);color:var(--ink)}
h2{margin-top:36px} h3{margin-top:28px}
/* maroon-as-ink headings (Direction A §5) */
h1 em,h1.lede em,h1 span,h2.rule strong{color:var(--acc)} .mono{font-family:var(--mono-font)}
/* ---- series chips: washi tape ---- */
.series-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px;margin:22px 0 8px}
.series-chip{position:relative;background:var(--paper2);border:1px solid var(--ruling);padding:16px 18px 14px 54px;display:block;box-shadow:2px 2px 0 var(--ruling-soft)}
.series-chip::before{content:"";position:absolute;top:-8px;left:50%;width:74px;height:18px;transform:translateX(-50%) rotate(-1.5deg);background:rgba(154,31,31,.16);border-left:1px dashed rgba(154,31,31,.3);border-right:1px dashed rgba(154,31,31,.3)}
.series-chip:hover{transform:translate(-1px,-1px);box-shadow:3px 3px 0 var(--ruling)}
.series-chip .chip-num{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-family:var(--mono-font);color:var(--ruling);font-size:13px;writing-mode:vertical-rl;text-orientation:mixed;letter-spacing:2px}
.series-chip strong{display:block;font-family:var(--serif-font);font-size:17px}
.series-chip span.mono{color:var(--iron);font-size:12.5px;display:block;margin-top:6px}
.series-chip:hover strong{color:var(--acc)}
/* ---- cards (latest entries): index cards with No. N tabs + offset shadows ---- */
.card{position:relative;background:var(--paper2);border:1px solid var(--ruling);border-radius:2px;padding:18px 22px;margin:18px 0;box-shadow:0 1px 0 #c9bc9d,3px 4px 0 rgba(90,78,55,.18);transition:transform .15s ease,box-shadow .15s ease}
.card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ruling)}
.card::after{content:"No. " attr(data-n);position:absolute;top:-10px;right:14px;background:var(--paper);border:1px solid var(--ruling);font-family:var(--mono-font);font-size:11px;padding:1px 8px;color:var(--mut)}
.card:hover{transform:translate(-2px,-2px);box-shadow:0 1px 0 #c9bc9d,5px 6px 0 rgba(90,78,55,.2)}
.card:hover::before{background:var(--acc)}
.card h3{margin:0 0 2px;font-size:22px;font-weight:600} .card h3 a{color:var(--ink);border-bottom:none} .card h3 a:hover{color:var(--acc)}
.meta{color:var(--iron);font-size:14px;font-family:var(--mono-font);margin:4px 0 10px} .meta .series{margin-right:14px;color:var(--acc)} .meta .date::after{content:" ·"}
.desc{margin:0 0 12px;font-size:16.5px}
.tag{display:inline-block;border:1px solid var(--ruling);color:var(--iron);font-family:var(--mono-font);font-size:12.5px;padding:1px 9px;margin:2px 5px 2px 0;border-radius:0}
.tag:hover{color:var(--acc);border-color:var(--acc);text-decoration:none}
/* ---- posts ---- */
.lede{color:var(--iron);font-size:20px} .post-title+.meta{margin-bottom:22px}
.main code{font-family:var(--mono-font);font-size:14px;background:var(--paper2);border:1px solid var(--ruling-soft);padding:1px 6px}
pre{background:var(--ink);color:#eae3d3;border:1px solid var(--ink);padding:16px 18px;overflow:auto;font-family:var(--mono-font);font-size:13.5px;line-height:1.55;box-shadow:2px 2px 0 rgba(0,0,0,.08)}
pre code{background:none;border:none;padding:0;color:inherit}
blockquote{border-left:3px solid var(--ruling);margin:20px 0;padding:2px 18px;color:var(--quote);font-style:italic}
hr{border:none;border-top:1px solid var(--ruling);margin:30px 0}
/* .archive reused as ruled ledger tables inside posts AND on the archive page */
table.archive,table.ledger{width:100%;border-collapse:collapse}
.archive td,.ledger td{padding:8px 10px;border-bottom:1px dashed var(--ruling);font-family:var(--serif-font)}
.archive td:first-child,.ledger td:first-child{font-family:var(--mono-font)}
.archive .d{color:var(--iron);white-space:nowrap;width:120px}
.archive tr:first-child,.ledger tr:first-child{border-top:1px solid var(--ruling)}
/* stat big-figure component (Direction A §7) */
.stat{display:inline-block;margin:18px 24px 18px 0;text-align:center}
.stat b{display:block;font-family:var(--serif-font);font-size:60px;font-weight:700;color:var(--acc);line-height:1;font-feature-settings:"onum" 1}
.stat span{font-family:var(--mono-font);font-size:12.5px;color:var(--mut)}
ol.toc li{margin:8px 0} ol.toc a{font-family:var(--serif-font)}
.postnav{display:flex;justify-content:space-between;gap:20px;margin-top:44px;border-top:1px solid var(--ruling);padding-top:18px;font-family:var(--serif-font)} .postnav .next{text-align:right} .postnav a{border-bottom:none}
/* ---- funnel: post footer CTA + hire page ---- */
.post-cta{margin-top:36px;background:var(--paper2);border:1px solid var(--ruling);border-left:3px solid var(--ruling);padding:16px 20px;box-shadow:2px 2px 0 var(--ruling-soft)}
.post-cta p{margin:0;font-size:16px;color:var(--iron)}
.post-cta hr{display:none}
.affiliate-disclosure{font-family:var(--mono-font);font-size:13.5px;color:var(--mut)}
.setup-btn{display:inline-block;margin-top:14px;background:var(--ink);color:#eae3d3;border:1px solid var(--ink);padding:10px 20px;font-family:var(--mono-font);font-size:14.5px;font-weight:500}
.setup-btn:hover{color:#fff;background:#1f1a14;border-bottom-color:var(--ink);text-decoration:none}
/* rubber stamp (Direction A §4/5) — maroon stamp, rotated */
.stamp{display:inline-block;font-family:var(--mono-font);font-size:12px;letter-spacing:2px;color:var(--acc);border:2px solid var(--acc);padding:3px 10px;transform:rotate(-2deg);opacity:.85;box-shadow:inset 0 0 0 1px rgba(154,31,31,.25)}
/* ---- hire page: service ticket ---- */
.tickets{list-style:none;padding:0;margin:22px 0;counter-reset:stub}
.ticket-stub{position:relative;background:var(--paper2);border:1px solid var(--ruling);border-top:2px dashed var(--ruling);padding:14px 16px 14px 52px;margin:0 0 12px;box-shadow:2px 2px 0 var(--ruling-soft)}
.stub-no{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-family:var(--mono-font);color:var(--acc);font-size:13px;letter-spacing:1px}
.stub-body p{margin:0}
.menu-card{margin:24px 0;padding:20px 22px;background:var(--paper2);border:1px solid var(--ruling);box-shadow:2px 2px 0 var(--ruling-soft)}
.menu-card h2{margin-top:0}
.menu-item{margin:10px 0;font-family:var(--serif-font)}
.menu-label{font-family:var(--mono-font);font-size:13px;color:var(--iron)}
.blank-slip{background:var(--paper2);border:1px solid var(--ruling);border-top:2px dashed var(--ruling);padding:22px;margin:26px 0;box-shadow:inset 0 0 0 1px var(--paper)}
.slip-head{display:flex;justify-content:space-between;align-items:baseline;border-bottom:1px solid var(--ruling);padding-bottom:8px;margin-bottom:10px}
.slip-title{font-family:var(--mono-font);font-size:13px;letter-spacing:3px;color:var(--acc)}
.slip-no{font-family:var(--mono-font);font-size:12px;color:var(--mut)}
.slip-note{font-family:var(--mono-font);font-size:13px;color:var(--iron);margin-top:12px}
.slip-thanks{margin-top:8px} .slip-thanks .stamp{margin:0 0 12px}
.main form label{display:block;font-family:var(--mono-font);font-size:13.5px;color:var(--iron);margin:16px 0 4px}
.main form input,.main form textarea{width:100%;background:var(--paper);border:1px solid var(--ruling);padding:9px 11px;font-family:var(--mono-font);font-size:14px;color:var(--ink)}
.main form input:focus,.main form textarea:focus{outline:none;border-color:var(--acc)}
/* hire stamp button — maroon CTA */
.stamp-btn{display:inline-block;margin-top:18px;background:var(--acc);color:var(--paper);border:none;padding:10px 24px;font-family:var(--mono-font);font-size:14px;cursor:pointer;transform:rotate(-.5deg);box-shadow:2px 3px 0 rgba(58,48,32,.25)}
.stamp-btn:hover{color:#fff;opacity:.95}
/* ---- footer: the terminal whisper ---- */
.site-foot{border-top:2px solid var(--ruling);margin-top:12px;padding:30px 28px 46px;color:var(--iron);font-size:14.5px}
.site-foot p{margin:6px 0}
.term-whisper{font-family:var(--mono-font);font-size:13.5px;color:var(--iron);background:var(--ink);color:#eae3d3;padding:12px 14px;margin:0 0 16px}
.term-whisper .prompt{color:#a03c2e}
.muted{color:var(--mut)} .posttags{margin-top:26px}
.colophon{color:var(--ruling);font-size:12.5px;font-family:var(--mono-font)}
img{max-width:100%;border:1px solid var(--ruling-soft);padding:2px;background:#fff}
@media(max-width:640px){.binding{width:14px;opacity:.6}.wrap{padding:0 20px}.site-head .wrap{height:auto;flex-direction:column;align-items:flex-start;padding-top:16px;padding-bottom:16px}nav a{margin:8px 14px 0 0}}