/* AI FIELDCRAFT — design system
   Palette: paper #E9E2CC · ink #191711 · stamp #A8352A · olive #55523B · terminal #14130E/#C9C4A9 */

:root{
  --paper:#E9E2CC;
  --paper-deep:#DFD6B8;
  --ink:#191711;
  --ink-soft:#3A362B;
  --stamp:#A8352A;
  --olive:#55523B;
  --term-bg:#14130E;
  --term-fg:#C9C4A9;
  --term-good:#8FA95C;
  --rule:2px solid var(--ink);
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto} *,*::before,*::after{animation:none!important;transition:none!important}}

body{
  background:var(--paper);
  color:var(--ink);
  font-family:"Public Sans",system-ui,sans-serif;
  font-size:1.0rem;
  line-height:1.62;
  /* faint paper grain */
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.05'/%3E%3C/svg%3E");
}

.wrap{max-width:880px;margin:0 auto;padding:0 20px}

/* ---------- type roles ---------- */
.stencil{font-family:"Stardos Stencil",monospace;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.mono{font-family:"IBM Plex Mono",monospace}
.eyebrow{font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--olive)}

h1{font-size:clamp(2rem,6vw,3.4rem);line-height:1.04}
h2{font-family:"IBM Plex Mono",monospace;font-size:1.05rem;letter-spacing:.08em;text-transform:uppercase;
   border-bottom:var(--rule);padding-bottom:.45rem;margin:2.6rem 0 1rem}
h3{font-size:1.05rem;margin:1.6rem 0 .5rem}
p{margin:.75rem 0}
a{color:var(--ink);text-decoration-color:var(--stamp);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--stamp)}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--stamp);outline-offset:2px}
ul,ol{margin:.75rem 0 .75rem 1.3rem}
li{margin:.3rem 0}
strong{font-weight:700}
small{font-size:.82rem}

/* ---------- masthead ---------- */
.masthead{border-bottom:var(--rule);background:var(--paper)}
.masthead .wrap{display:flex;justify-content:space-between;align-items:center;padding-top:14px;padding-bottom:14px;gap:12px;flex-wrap:wrap}
.masthead .brand{font-size:1.15rem;text-decoration:none}
.masthead nav{display:flex;gap:18px;font-family:"IBM Plex Mono",monospace;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em}
.masthead nav a{text-decoration:none;border-bottom:2px solid transparent}
.masthead nav a:hover{border-bottom-color:var(--stamp)}

/* ---------- FM cover block (signature) ---------- */
.cover{border:3px solid var(--ink);margin:44px 0;padding:38px 30px;position:relative;background:var(--paper)}
.cover .desig{display:flex;justify-content:space-between;font-family:"IBM Plex Mono",monospace;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:26px}
.cover .title-sub{font-family:"IBM Plex Mono",monospace;font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;margin-top:14px;color:var(--ink-soft)}
.cover .release{margin-top:30px;border-top:2px solid var(--ink);padding-top:12px;font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:var(--olive)}

.stamp{
  display:inline-block;border:3px solid var(--stamp);color:var(--stamp);
  font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  padding:.35em .7em;transform:rotate(-4deg);mix-blend-mode:multiply;opacity:.88;
}
.cover .stamp{position:absolute;right:22px;bottom:56px}
@media(max-width:640px){.cover .stamp{position:static;display:inline-block;margin-top:18px}}

/* ---------- manual index table ---------- */
.index-table{width:100%;border-collapse:collapse;margin:1.2rem 0;font-size:.95rem}
.index-table th{font-family:"IBM Plex Mono",monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;text-align:left;border-bottom:var(--rule);padding:.5rem .6rem}
.index-table td{border-bottom:1px solid var(--olive);padding:.7rem .6rem;vertical-align:top}
.index-table .fm{font-family:"IBM Plex Mono",monospace;font-weight:700;white-space:nowrap}
.index-table a{font-weight:600}

.tag-free,.tag-paid{font-family:"IBM Plex Mono",monospace;font-size:.66rem;letter-spacing:.1em;padding:.15em .45em;border:2px solid var(--olive);color:var(--olive);text-transform:uppercase;white-space:nowrap}
.tag-paid{border-color:var(--stamp);color:var(--stamp)}

/* ---------- forms / buttons ---------- */
.signal{border:3px solid var(--ink);padding:26px;margin:2.2rem 0;background:var(--paper-deep)}
.signal form{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.signal input[type=email]{flex:1 1 240px;padding:.7em .8em;font-family:"IBM Plex Mono",monospace;font-size:.9rem;border:2px solid var(--ink);background:var(--paper)}
button,.btn{display:inline-block;background:var(--ink);color:var(--paper);border:2px solid var(--ink);
  font-family:"IBM Plex Mono",monospace;font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;
  padding:.75em 1.3em;cursor:pointer;text-decoration:none}
button:hover,.btn:hover{background:var(--stamp);border-color:var(--stamp);color:var(--paper)}
.btn-ghost{background:transparent;color:var(--ink)}
.btn-ghost:hover{background:var(--ink);color:var(--paper)}

/* ---------- guide pages ---------- */
.manual-head{border:3px solid var(--ink);padding:24px;margin:36px 0 28px}
.manual-head .desig{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--olive);margin-bottom:12px}
.manual-head h1{font-size:clamp(1.5rem,4.5vw,2.3rem)}
.manual-head .purpose{margin-top:12px;font-size:1.02rem;color:var(--ink-soft)}

.para-num{font-family:"IBM Plex Mono",monospace;font-weight:700;color:var(--stamp);margin-right:.4em}

pre{background:var(--term-bg);color:var(--term-fg);padding:18px;overflow-x:auto;margin:1rem 0;
    font-family:"IBM Plex Mono",monospace;font-size:.84rem;line-height:1.55;border-left:6px solid var(--olive)}
code{font-family:"IBM Plex Mono",monospace;font-size:.88em;background:var(--paper-deep);padding:.1em .35em}
pre code{background:none;padding:0}
pre .c{color:#7A765F}  /* comments */
pre .g{color:var(--term-good)} /* good output */

table.spec{width:100%;border-collapse:collapse;margin:1rem 0;font-size:.9rem}
table.spec th{font-family:"IBM Plex Mono",monospace;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;text-align:left;border-bottom:var(--rule);padding:.45rem .5rem}
table.spec td{border-bottom:1px solid var(--olive);padding:.55rem .5rem;vertical-align:top}
@media(max-width:640px){table.spec{display:block;overflow-x:auto}}

.warnbox{border:3px solid var(--stamp);padding:16px 18px;margin:1.2rem 0}
.warnbox .label{font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:.7rem;letter-spacing:.14em;color:var(--stamp);text-transform:uppercase}

.notebox{border-left:6px solid var(--olive);background:var(--paper-deep);padding:14px 18px;margin:1.2rem 0}

.faq dt{font-weight:700;margin-top:1rem}
.faq dd{margin-left:0}

.crossref{border-top:var(--rule);margin-top:3rem;padding-top:1.2rem}
.crossref .eyebrow{display:block;margin-bottom:.5rem}

/* ---------- footer ---------- */
footer{border-top:var(--rule);margin-top:64px;padding:26px 0 44px;font-family:"IBM Plex Mono",monospace;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--olive)}
footer .wrap{display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap}
footer a{color:var(--olive)}

/* ---------- offer ladder ---------- */
.ladder{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin:1.4rem 0}
.rung{border:3px solid var(--ink);padding:20px;background:var(--paper);display:flex;flex-direction:column;gap:8px}
.rung .price{font-family:"IBM Plex Mono",monospace;font-weight:700;font-size:1.3rem}
.rung .btn{margin-top:auto;text-align:center}
.rung.hot{background:var(--ink);color:var(--paper)}
.rung.hot a{color:var(--paper);text-decoration-color:var(--stamp)}
.rung.hot .btn{background:var(--stamp);border-color:var(--stamp)}