:root{
  --paper:#f6eedb; --paper2:#efe3c8; --ink:#33291f; --ink-soft:#5a4c3c;
  --orange:#c8551a; --orange-dk:#a13f0e; --gold:#e0a32e; --avocado:#6b7f3a; --avocado-dk:#52622c;
  --cream-card:#fdf8ea; --rule:#c9b folkd;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font:19px/1.75 'Lora',Georgia,serif;
  position:relative;
}
/* paper grain */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.5;
  background-image:radial-gradient(rgba(51,41,31,.05) 1px,transparent 1px);
  background-size:4px 4px;
}
.wrap{max-width:880px;margin:0 auto;padding:0 22px;position:relative;z-index:2}
h1,h2,h3,.display{font-family:'Ultra',Georgia,serif;font-weight:400;letter-spacing:.01em}
a{color:var(--orange-dk);text-decoration-thickness:2px;text-underline-offset:3px}
a:hover{color:var(--orange)}

/* ---------- BOOK COVER HERO ---------- */
.cover{
  background:var(--orange);
  background-image:
    radial-gradient(rgba(0,0,0,.08) 1.2px,transparent 1.2px),
    linear-gradient(160deg,#cf5d20 0%,#c8551a 55%,#b34812 100%);
  background-size:5px 5px,100% 100%;
  border-bottom:10px solid var(--ink);
  padding:40px 0 0;
  overflow:hidden;
}
.cover .frame{
  max-width:880px;margin:0 auto;padding:34px 26px 44px;
  border:5px solid var(--paper);outline:3px solid rgba(51,41,31,.5);outline-offset:-12px;
  border-bottom:none;border-radius:14px 14px 0 0;
  position:relative;text-align:center;color:var(--paper);
}
.cover .topline{
  font-family:'Lora',serif;font-style:italic;font-size:clamp(16px,2.4vw,21px);
  color:#ffe9b8;margin-bottom:6px;letter-spacing:.02em;
}
.cover h1{
  font-size:clamp(44px,9vw,96px);line-height:.98;color:var(--paper);
  text-shadow:4px 4px 0 var(--ink);
  margin:8px 0 4px;
}
.cover h1 .to-ai{color:var(--gold);text-shadow:4px 4px 0 var(--ink)}
.cover .tagline{
  font-size:clamp(19px,3vw,26px);font-family:'Lora',serif;font-weight:700;
  color:var(--paper);margin:18px auto 6px;max-width:620px;line-height:1.4;
}
.cover .sub{font-style:italic;color:#ffe2c2;font-size:17px;max-width:560px;margin:0 auto}
.burst{
  position:absolute;top:-14px;right:-10px;width:128px;height:128px;display:grid;place-items:center;
  background:var(--gold);color:var(--ink);border-radius:50%;
  clip-path:polygon(50% 0%,57% 11%,69% 4%,71% 17%,84% 14%,81% 27%,95% 29%,87% 39%,100% 46%,89% 54%,98% 64%,85% 66%,90% 79%,77% 76%,77% 90%,65% 83%,60% 96%,50% 86%,40% 96%,35% 83%,23% 90%,23% 76%,10% 79%,15% 66%,2% 64%,11% 54%,0% 46%,13% 39%,5% 29%,19% 27%,16% 14%,29% 17%,31% 4%,43% 11%);
  font-family:'Ultra',serif;font-size:15px;line-height:1.1;text-align:center;transform:rotate(10deg);
  padding:20px;
}
@media(max-width:700px){.burst{width:96px;height:96px;font-size:11px;top:-8px;right:-6px;padding:14px}}
.price{
  position:absolute;top:18px;left:18px;font-family:'Permanent Marker',cursive;
  color:#ffe9b8;font-size:18px;transform:rotate(-8deg);
}
.price s{opacity:.75}
/* robot illustration */
.bot{margin:26px auto 0;display:block;width:min(330px,72vw);filter:drop-shadow(5px 6px 0 rgba(51,41,31,.45))}
.cover .edition{
  font-family:'Lora',serif;font-size:14px;letter-spacing:.18em;text-transform:uppercase;
  color:#ffd9ad;margin-top:22px;
}

/* ---------- HOMAGE STRIP ---------- */
.homage{
  background:var(--avocado);color:var(--paper);
  border-bottom:6px solid var(--ink);
  padding:20px 0;font-size:17px;
}
.homage .wrap{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.homage b{color:#ffe9b8}
.homage a{color:#ffe9b8}
.homage .cb{flex:0 0 auto}

/* ---------- CHAPTERS ---------- */
.chapter{padding:64px 0 30px}
.chap-head{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;margin-bottom:6px}
.chap-num{
  font-family:'Ultra',serif;background:var(--ink);color:var(--gold);
  padding:6px 16px 4px;border-radius:8px;font-size:18px;white-space:nowrap;
  transform:rotate(-2deg);box-shadow:3px 3px 0 rgba(51,41,31,.25);
}
h2{font-size:clamp(30px,5vw,44px);color:var(--orange-dk);line-height:1.08}
.chapter > .wrap > p, .chapter .prose p{max-width:720px;margin:16px 0;color:var(--ink)}
.chapter .lead-line{font-size:21px;font-style:italic;color:var(--ink-soft)}
.handnote{font-family:'Permanent Marker',cursive;color:var(--avocado-dk);font-size:18px;transform:rotate(-1.5deg);display:inline-block}

/* steps */
ol.bigsteps{list-style:none;counter-reset:s;max-width:720px;margin:22px 0}
ol.bigsteps li{
  counter-increment:s;position:relative;padding:18px 18px 18px 86px;margin:14px 0;
  background:var(--cream-card);border:3px solid var(--ink);border-radius:14px;
  box-shadow:5px 5px 0 rgba(51,41,31,.18);font-size:18.5px;
}
ol.bigsteps li::before{
  content:counter(s);position:absolute;left:18px;top:50%;transform:translateY(-50%) rotate(-4deg);
  width:50px;height:50px;display:grid;place-items:center;
  background:var(--gold);border:3px solid var(--ink);border-radius:50%;
  font-family:'Ultra',serif;font-size:24px;color:var(--ink);
}
ol.bigsteps b{color:var(--orange-dk)}

/* lingo table */
.lingo{max-width:760px;margin:24px 0 8px;border:4px solid var(--ink);border-radius:14px;overflow:hidden;background:var(--cream-card);box-shadow:6px 6px 0 rgba(51,41,31,.18)}
.lingo table{width:100%;border-collapse:collapse;font-size:17.5px}
.lingo th{
  background:var(--ink);color:var(--gold);font-family:'Ultra',serif;font-weight:400;
  padding:12px 16px;text-align:left;font-size:16px;letter-spacing:.04em;
}
.lingo td{padding:13px 16px;border-bottom:2px dashed #cdbb96;vertical-align:top}
.lingo tr:last-child td{border-bottom:none}
.lingo tr:nth-child(even) td{background:#f7efd9}
.lingo td:first-child{font-weight:700;color:var(--orange-dk);white-space:nowrap;width:200px}
@media(max-width:620px){.lingo td:first-child{white-space:normal;width:auto}}
.lingo .cbsay{font-family:'Permanent Marker',cursive;font-size:15px;color:var(--avocado-dk);display:block;font-weight:400}

/* rules */
ul.rules{list-style:none;max-width:720px;margin:20px 0}
ul.rules li{
  position:relative;padding:14px 16px 14px 58px;margin:10px 0;font-size:18.5px;
  background:var(--cream-card);border-left:8px solid var(--orange);border-radius:0 12px 12px 0;
}
ul.rules li::before{
  content:"10-4";position:absolute;left:8px;top:16px;transform:rotate(-8deg);
  font-family:'Permanent Marker',cursive;font-size:13px;color:var(--avocado-dk);
}
ul.rules li.warn{border-left-color:var(--ink)}
ul.rules li.warn::before{content:"WHOA"}
ul.rules b{color:var(--orange-dk)}

/* rig cards */
.rig{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:24px 0;max-width:760px}
.rigcard{
  background:var(--cream-card);border:3px solid var(--ink);border-radius:14px;padding:20px;
  box-shadow:5px 5px 0 rgba(51,41,31,.18);text-align:center;
}
.rigcard .display{font-size:21px;color:var(--orange-dk);margin-bottom:6px}
.rigcard p{font-size:16.5px;color:var(--ink-soft)}
.rigcard .tag{
  display:inline-block;margin-top:10px;font-family:'Permanent Marker',cursive;
  color:var(--avocado-dk);font-size:15px;transform:rotate(-2deg);
}

/* dividers */
.divider{height:0;border-top:4px dashed #c5ae7f;max-width:880px;margin:36px auto 0}

/* coming + footer */
.coming{
  background:var(--gold);border-top:6px solid var(--ink);border-bottom:6px solid var(--ink);
  padding:34px 0;margin-top:56px;
}
.coming .wrap{text-align:center}
.coming .display{font-size:clamp(22px,3.6vw,30px);color:var(--ink)}
.coming p{max-width:640px;margin:10px auto 0;font-size:17.5px}
footer{background:var(--ink);color:#cdbb96;padding:34px 0 44px;font-size:15.5px}
footer .wrap{text-align:center}
footer a{color:var(--gold)}
footer .cq{font-family:'Permanent Marker',cursive;font-size:17px;color:#e0a32e;margin-bottom:10px}

/* ---------- CHAPTER PAGES ---------- */
.chap-cover{background:var(--orange);background-image:radial-gradient(rgba(0,0,0,.08) 1.2px,transparent 1.2px),linear-gradient(160deg,#cf5d20,#b34812);background-size:5px 5px,100% 100%;border-bottom:8px solid var(--ink);padding:36px 0 30px;text-align:center;color:var(--paper)}
.chap-cover .plate{display:inline-block;font-family:'Ultra',serif;background:var(--ink);color:var(--gold);padding:7px 20px 5px;border-radius:8px;font-size:17px;transform:rotate(-2deg);margin-bottom:14px}
.chap-cover h1{font-size:clamp(32px,6.5vw,58px);color:var(--paper);text-shadow:3px 3px 0 var(--ink);line-height:1.05;margin:0 0 10px}
.chap-cover .tagline{font-style:italic;color:#ffe2c2;font-size:clamp(17px,2.4vw,21px);max-width:640px;margin:0 auto}
.chap-cover .home-link{display:inline-block;margin-top:16px;font-family:'Lora',serif;font-size:15px;color:#ffe9b8}
.pagenav{display:flex;justify-content:space-between;gap:14px;max-width:880px;margin:40px auto 0;padding:22px;border-top:4px dashed #c5ae7f;flex-wrap:wrap}
.pagenav a{font-family:'Ultra',serif;font-size:16px;color:var(--orange-dk);text-decoration:none;background:var(--cream-card);border:3px solid var(--ink);border-radius:10px;padding:10px 18px;box-shadow:4px 4px 0 rgba(51,41,31,.18)}
.pagenav a:hover{background:var(--gold)}
.chapgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin:24px 0;max-width:880px}
.chapcard{display:block;background:var(--cream-card);border:3px solid var(--ink);border-radius:14px;padding:20px;box-shadow:5px 5px 0 rgba(51,41,31,.18);text-decoration:none;color:var(--ink);transition:transform .12s}
.chapcard:hover{transform:translateY(-3px);background:#fff8e6}
.chapcard .display{font-size:19px;color:var(--orange-dk);margin:6px 0 6px;font-family:'Ultra',serif}
.chapcard .cnum{font-family:'Permanent Marker',cursive;color:var(--avocado-dk);font-size:14px}
.chapcard p{font-size:15.5px;color:var(--ink-soft);margin:0}
.chapcard.soon{opacity:.65;border-style:dashed;box-shadow:none}