:root{
  --paper:#f2eee3; --paper2:#e9e4d5; --ink:#1b1916; --ink2:#4a453c; --mute:#8a8274;
  --line:#c9c2af; --red:#b3382c; --tape:rgba(214,196,138,.55); --card:#faf7ee;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"Courier Prime","Courier New",monospace;font-size:16px;line-height:1.65}
img{max-width:100%;height:auto;display:block}
.wrap{max-width:880px;margin:0 auto;padding:28px 16px 90px}
@media(min-width:700px){.wrap{padding:48px 32px 120px}}

/* title page */
.slate{border:2px solid var(--ink);padding:22px 14px 16px;text-align:center;background:var(--card)}
@media(min-width:700px){.slate{padding:34px 40px 26px}}
.slate .top{font-size:12px;letter-spacing:.25em;text-transform:uppercase;color:var(--mute)}
.slate h1{font-family:"Special Elite","Courier Prime",monospace;font-weight:400;font-size:clamp(30px,7vw,56px);margin:18px 0 6px;letter-spacing:.02em}
.slate .sub{font-size:15px;color:var(--ink2)}
.slate .rule{width:120px;height:2px;background:var(--ink);margin:14px auto}
.slate .credit{font-size:13px;color:var(--ink2);margin-top:4px}
.stamp{display:inline-block;margin-top:14px;padding:6px 14px;border:2px solid var(--red);color:var(--red);font-family:"Special Elite",monospace;font-size:13px;letter-spacing:.2em;text-transform:uppercase;transform:rotate(-2deg)}

/* sections */
h2.slug{font-family:"Special Elite","Courier Prime",monospace;font-weight:400;font-size:clamp(19px,4vw,24px);letter-spacing:.04em;text-transform:uppercase;margin:64px 0 6px;padding-top:22px;border-top:2px solid var(--ink)}
h2.slug .no{color:var(--red);margin-right:10px}
p.note{color:var(--ink2);margin:8px 0 20px;max-width:64ch}
.small{font-size:13px;color:var(--mute)}

/* tools */
.tools{display:grid;grid-template-columns:1fr;gap:12px;margin-top:18px}
@media(min-width:640px){.tools{grid-template-columns:1fr 1fr}}
.tool{display:flex;gap:14px;align-items:flex-start;background:var(--card);border:1px solid var(--line);padding:14px}
.tool img{width:44px;height:44px;border-radius:8px;flex:none}
.tool b{display:block;font-size:15px}
.tool span{font-size:13px;color:var(--ink2)}

/* still frames */
.still{background:var(--card);border:1px solid var(--line);padding:10px 10px 8px;position:relative;margin:16px 0}
.still::before{content:"";position:absolute;top:-10px;left:50%;transform:translateX(-50%) rotate(-1.5deg);width:110px;height:22px;background:var(--tape)}
.still img{border:1px solid var(--line)}
.still figcaption{font-size:13px;color:var(--ink2);padding:8px 2px 2px;text-align:center}
.row2{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.row2{grid-template-columns:1fr 1fr}}
.row3{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:640px){.row3{grid-template-columns:1fr 1fr 1fr}}
.single{max-width:460px;margin:16px auto}
.step-tag{display:inline-block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);border:1px solid var(--line);padding:3px 9px;margin-bottom:10px;background:var(--paper2)}

/* prompt blocks */
.prompt{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--red);margin:18px 0;overflow:hidden}
.prompt .bar{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 12px;border-bottom:1px dashed var(--line)}
.prompt .bar b{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink2);font-weight:700}
.copy{font-family:"Courier Prime",monospace;font-size:12px;letter-spacing:.06em;background:var(--ink);color:var(--paper);border:0;padding:7px 12px;cursor:pointer}
.copy:active{transform:translateY(1px)}
.prompt pre{margin:0;padding:14px;white-space:pre-wrap;word-break:break-word;font-family:"Courier Prime",monospace;font-size:13.5px;line-height:1.6;max-height:420px;overflow:auto}
details.prompt > summary{list-style:none;cursor:pointer;padding:10px 12px;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--red)}
details.prompt > summary::before{content:"+ "}
details.prompt[open] > summary::before{content:"- "}

/* tables */
.tblwrap{overflow-x:auto;margin:16px 0}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:520px;background:var(--card)}
th{font-family:"Special Elite",monospace;font-weight:400;text-transform:uppercase;font-size:12px;letter-spacing:.12em;text-align:left;border:1px solid var(--line);padding:9px 10px;background:var(--paper2)}
td{border:1px solid var(--line);padding:9px 10px;vertical-align:top}
td code{font-size:13px;background:var(--paper2);padding:1px 5px}

.rulelist{margin:0;padding-left:0;list-style:none;counter-reset:r}
.rulelist li{counter-increment:r;padding:12px 0;border-bottom:1px dashed var(--line);max-width:70ch}
.rulelist li::before{content:counter(r,decimal-leading-zero)"  ";color:var(--red);font-weight:700}

.end{margin-top:70px;border:2px solid var(--ink);background:var(--card);text-align:center;padding:36px 18px}
.end h2{font-family:"Special Elite",monospace;font-weight:400;font-size:clamp(20px,5vw,30px);margin:0 0 8px}
.end p{color:var(--ink2);margin:0}
footer{margin-top:34px;text-align:center;font-size:12px;color:var(--mute)}
.hero-img{margin:20px 0 0;background:var(--card);padding:0}
.hero-img img{border:1px solid var(--line)}
.hero-img figcaption{font-size:13px;color:var(--ink2);text-align:center;padding:8px 0 2px}
.btns{display:flex;gap:8px;flex:none}
.view{font-family:"Courier Prime",monospace;font-size:12px;letter-spacing:.06em;background:transparent;color:var(--ink);border:1px solid var(--ink);padding:6px 12px;cursor:pointer}
.prompt pre.clip{max-height:110px;overflow:hidden;position:relative}
.prompt .prewrap{position:relative}
.prompt .prewrap::after{content:"";position:absolute;left:0;right:0;bottom:0;height:70px;background:linear-gradient(to bottom, rgba(250,247,238,0), var(--card));pointer-events:none}
.prompt .prewrap.open::after{display:none}
.toolicon{width:44px;height:44px;flex:none;display:flex;align-items:center;justify-content:center;background:var(--ink);border-radius:8px}
.toolicon svg{width:26px;height:26px;fill:var(--paper)}

/* community popup */
.pop-overlay{position:fixed;inset:0;background:rgba(27,25,22,.55);z-index:90;display:none}
.pop-overlay.show{display:block}
.pop{position:fixed;z-index:91;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,calc(100vw - 32px));background:var(--card);border:2px solid var(--ink);box-shadow:6px 6px 0 rgba(27,25,22,.35);padding:22px 18px 18px;display:none}
.pop.show{display:block}
.pop .pclose{position:absolute;top:8px;right:10px;background:none;border:0;font-family:"Courier Prime",monospace;font-size:18px;cursor:pointer;color:var(--mute);padding:4px 8px}
.pop h3{font-family:"Special Elite",monospace;font-weight:400;font-size:20px;margin:0 0 8px;letter-spacing:.02em}
.pop p{font-size:13.5px;color:var(--ink2);margin:0 0 14px;line-height:1.55}
.pop .why{list-style:none;margin:0 0 14px;padding:0;display:flex;flex-direction:column;gap:9px}
.pop .why li{font-size:12.5px;color:var(--ink2);line-height:1.4;display:flex;align-items:flex-start;gap:9px}
.pop .why svg{width:15px;height:15px;flex:none;margin-top:1px;fill:none;stroke:var(--red);stroke-width:1.8}
.pop form{display:flex;flex-direction:column;gap:10px}
.pop input[type=email]{width:100%;font-family:"Courier Prime",monospace;font-size:16px;padding:11px 12px;border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);border-radius:0;-webkit-appearance:none}
.pop input[type=email]:focus{outline:2px solid var(--red);outline-offset:1px}
.pop .join{font-family:"Special Elite",monospace;font-size:15px;letter-spacing:.08em;background:var(--ink);color:var(--paper);border:0;padding:12px;cursor:pointer;text-transform:uppercase}
.pop .join:active{transform:translateY(1px)}
.sugg{display:flex;gap:6px;flex-wrap:wrap;min-height:0}
.sugg button{font-family:"Courier Prime",monospace;font-size:12.5px;background:var(--paper2);border:1px solid var(--line);padding:6px 10px;cursor:pointer;color:var(--ink)}
.sugg button:active{transform:translateY(1px)}
.pop .fine{font-size:11.5px;color:var(--mute);margin:2px 0 0}
.pop .done{display:none;text-align:center;padding:18px 4px}
.pop .done h3{margin-bottom:6px}
.pop.success form,.pop.success .lead{display:none}
.pop.success .done{display:block}
/* next-page cards */
.next-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:26px}
@media(min-width:700px){.next-grid{grid-template-columns:1fr 1fr}}
.next-card{display:flex;align-items:center;gap:16px;border:2px solid var(--ink);background:var(--card);padding:14px;text-decoration:none;color:var(--ink);box-shadow:5px 5px 0 rgba(27,25,22,.25);transition:transform .08s ease}
.next-card:active{transform:translate(2px,2px);box-shadow:2px 2px 0 rgba(27,25,22,.25)}
.next-card img{width:100px;height:80px;object-fit:cover;border:1px solid var(--line);flex:none}
.next-card .nc-label{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.next-card .nc-title{font-family:"Special Elite",monospace;font-size:clamp(15px,3.2vw,19px);line-height:1.25;margin-top:4px}
.next-card .nc-sub{font-size:12px;color:var(--ink2);margin-top:4px}
.next-card .nc-arrow{margin-left:auto;font-size:20px;color:var(--red);flex:none;padding-right:2px}
@media(max-width:480px){.next-card img{width:84px;height:68px}}

/* content gate */
body.gate-locked{overflow:hidden}
body.gate-locked .wrap{filter:blur(14px) saturate(.7);pointer-events:none;user-select:none}
.wrap{transition:filter .35s ease}
.pop.gate-forced .pclose{display:none}