/* Jinx It script page — mirrors the WP pattern CSS (block: .bjs-*) */
.bjs{--bjs-max:1180px;background:var(--bg);color:var(--cream);font-family:var(--font-body)}
.bjs a{color:var(--gold-300)}
.bjs a:hover{color:var(--gold-200)}
.bjs__wrap{max-width:var(--bjs-max);margin:0 auto;padding:0 var(--space-5)}

/* ---- masthead ---- */
.bjs__head{position:relative;overflow:hidden;background:var(--purple-900);background-image:var(--halftone);background-size:var(--halftone-size);border-bottom:var(--bw-bold) solid var(--ink);padding:var(--space-7) 0 var(--space-6)}
.bjs__head .bjs__wrap>.bjs__crumb,.bjs__head .bjs__wrap>.bjs__badge,.bjs__head .bjs__wrap>.bjs__title,.bjs__head .bjs__wrap>.bjs__byline{max-width:calc(100% - 250px)}
.bjs__crumb{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-300);margin-bottom:var(--space-4)}
.bjs__crumb a{text-decoration:none;color:var(--gold-300)}
.bjs__crumb a:hover{text-decoration:underline}
.bjs__crumb span{color:var(--purple-300)}
.bjs__badge{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-weight:700;font-size:var(--fs-2xs);letter-spacing:.12em;text-transform:uppercase;color:var(--ink);background:var(--gold-400);border:var(--bw-ink) solid var(--ink);border-radius:var(--radius-pill);padding:4px 14px;margin-bottom:var(--space-3)}
.bjs__title{font-family:var(--font-display);font-weight:400;font-size:clamp(40px,7vw,76px);line-height:.98;margin:0;color:var(--cream);text-transform:uppercase;-webkit-text-stroke:2px var(--ink);text-shadow:5px 5px 0 var(--ink);text-wrap:balance}
.bjs__byline{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-top:var(--space-4);font-size:var(--fs-lg)}
.bjs__names{display:flex;flex-direction:column;gap:2px}
.bjs__by{font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--purple-200)}
.bjs__author{font-family:var(--font-heading);font-weight:800;color:var(--gold-300);font-size:var(--fs-xl)}
.bjs__handle{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:.06em;color:var(--purple-300)}
.bjs-card__handle{font-family:var(--font-mono);font-size:var(--fs-2xs);letter-spacing:.06em;color:var(--purple-300)}

.bjs__burst{position:absolute;right:32px;top:50%;transform:translateY(-50%) rotate(-9deg);z-index:3;width:190px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;background:var(--pop-red);color:var(--paper);filter:drop-shadow(5px 6px 0 var(--ink));clip-path:polygon(50% 0%,61% 13%,78% 8%,76% 26%,94% 28%,84% 43%,100% 53%,83% 61%,92% 78%,73% 75%,72% 94%,57% 82%,46% 98%,40% 80%,22% 88%,25% 70%,6% 70%,18% 55%,2% 44%,21% 39%,13% 22%,32% 25%,33% 6%,48% 17%);transition:transform var(--dur) var(--ease-pop)}
.bjs__burst:hover{transform:translateY(-50%) rotate(-3deg) scale(1.05);color:#fff}
.bjs__burst span{transform:rotate(5deg);font-family:var(--font-display);font-weight:400;font-size:34px;line-height:.9;text-transform:uppercase;letter-spacing:.02em;-webkit-text-stroke:1px rgba(22,16,43,.55)}
@media (max-width:900px){.bjs__head .bjs__wrap>.bjs__crumb,.bjs__head .bjs__wrap>.bjs__badge,.bjs__head .bjs__wrap>.bjs__title,.bjs__head .bjs__wrap>.bjs__byline{max-width:100%}.bjs__burst{position:relative;right:auto;top:auto;transform:rotate(-6deg);margin:var(--space-5) 0 0;width:160px}.bjs__burst:hover{transform:rotate(-2deg) scale(1.04)}.bjs__burst span{font-size:29px}}
/* ---- body grid ---- */
.bjs__body{padding:var(--space-7) 0 var(--space-9)}
.bjs__panel{background:var(--paper);color:var(--ink);border:var(--bw-ink) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-comic);padding:var(--space-5) var(--space-6)}
.bjs__panel h2{font-family:var(--font-heading);font-weight:900;font-size:var(--fs-xs);letter-spacing:.14em;text-transform:uppercase;margin:0 0 var(--space-3);color:var(--purple-700)}
.bjs__prose>*:first-child{margin-top:0}
.bjs__prose>*:last-child{margin-bottom:0}
.bjs__prose p{margin:0 0 1em;font-size:var(--fs-md);line-height:1.62;text-wrap:pretty}
.bjs__prose ul{margin:0 0 1em;padding-left:1.2em}
.bjs__prose li{margin:0 0 .5em;font-size:var(--fs-md);line-height:1.6}
.bjs__prose strong{color:var(--purple-800)}

/* ---- images ---- */
.bjs__figs{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5);margin-top:var(--space-6)}
.bjs__fig{margin:0}
.bjs__figcap{display:flex;align-items:baseline;justify-content:space-between;gap:12px;font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-300);margin-bottom:var(--space-2)}
.bjs__frame{position:relative;background:var(--paper);border:var(--bw-ink) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-comic);overflow:hidden}
.bjs__frame img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:top center}
.bjs__frame a.bjs__zoom{display:block;text-decoration:none;cursor:zoom-in}
.bjs__frame a.bjs__zoom::after{content:"Click to expand";position:absolute;left:0;right:0;bottom:0;padding:9px 12px;text-align:center;font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--paper);background:rgba(22,16,43,.86);border-top:var(--bw-ink) solid var(--ink);transition:background var(--dur) var(--ease-out)}
.bjs__frame:hover a.bjs__zoom::after{background:var(--pop-red)}
.bjs__frame.is-missing a.bjs__zoom::after{display:none}
/* lightbox */
.bjs-lb{position:fixed;inset:0;z-index:400;display:none;background:rgba(14,8,28,.9);overflow:auto;padding:56px 20px 40px;text-align:center}
.bjs-lb.is-open{display:block}
.bjs-lb img{max-width:min(1100px,100%);width:100%;height:auto;background:var(--paper);border:var(--bw-bold) solid var(--ink);border-radius:var(--radius-md);box-shadow:var(--shadow-comic-lg)}
.bjs-lb__cap{margin:0 auto 14px;font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-300)}
.bjs-lb__x{position:fixed;top:14px;right:18px;z-index:401;width:42px;height:42px;display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--cream);background:var(--purple-800);border:var(--bw-ink) solid var(--ink);border-radius:50%;box-shadow:var(--shadow-comic-sm);cursor:pointer}
.bjs-lb__x:hover{background:var(--pop-red);color:#fff}
.bjs__drop{display:none;aspect-ratio:16/7;background-color:var(--purple-800);align-items:center;justify-content:center;flex-direction:column;gap:10px;padding:var(--space-5);text-align:center;background-image:repeating-linear-gradient(45deg,rgba(230,212,131,.09) 0 10px,transparent 10px 20px)}
.bjs__frame.is-missing .bjs__drop{display:flex}
.bjs__frame.is-missing img{display:none}
.bjs__drop code{font-family:var(--font-mono);font-size:var(--fs-2xs);color:var(--gold-300);background:var(--purple-950);border:1px solid var(--purple-500);border-radius:4px;padding:3px 7px;word-break:break-all}
.bjs__drop p{margin:0;font-family:var(--font-mono);font-size:var(--fs-xs);color:var(--purple-200);line-height:1.6}

/* ---- actions ---- */
.bjs__actions{display:flex;flex-wrap:wrap;gap:var(--space-3);margin-top:var(--space-6)}
.bjs__btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-heading);font-weight:800;font-size:var(--fs-sm);text-decoration:none;padding:.8rem 1.25rem;border-radius:var(--radius-md);border:var(--bw-ink) solid var(--ink);background:var(--pop-red);color:var(--paper);box-shadow:var(--shadow-comic-sm);transition:transform var(--dur) var(--ease-pop),box-shadow var(--dur) var(--ease-pop)}
.bjs__btn:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-comic);color:#fff}
.bjs__btn:active{transform:translate(3px,3px);box-shadow:0 0 0 var(--ink)}
.bjs__btn--ghost{background:transparent;color:var(--cream);border-color:var(--purple-400)}
.bjs__btn--ghost:hover{background:var(--purple-800);color:var(--gold-300)}
.bjs__btn small{font-family:var(--font-mono);font-weight:400;font-size:var(--fs-2xs);opacity:.75;text-transform:uppercase;letter-spacing:.08em}

/* ---- footer nav ---- */
.bjs__foot{border-top:var(--bw-ink) solid var(--ink);background:var(--purple-950);padding:var(--space-5) 0}
.bjs__foot .bjs__wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);flex-wrap:wrap}
.bjs__home{display:inline-flex;align-items:center;gap:8px;order:2;font-family:var(--font-mono);font-size:var(--fs-2xs);font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;color:var(--gold-300);border:var(--bw-ink) solid var(--purple-500);border-radius:var(--radius-pill);padding:8px 16px}
.bjs__home:hover{background:var(--purple-800);color:var(--gold-200);border-color:var(--gold-400)}
.bjs__pager{order:1}
.bjs__pager--next{order:3}
.bjs__pager{display:inline-flex;flex-direction:column;gap:2px;text-decoration:none;max-width:44%}
.bjs__pager em{font-family:var(--font-mono);font-style:normal;font-size:var(--fs-2xs);letter-spacing:.12em;text-transform:uppercase;color:var(--purple-300)}
.bjs__pager b{font-family:var(--font-heading);font-weight:800;color:var(--gold-300);font-size:var(--fs-md)}
.bjs__pager:hover b{color:var(--gold-200);text-decoration:underline}
.bjs__pager--next{text-align:right;margin-left:auto}

.bjs__figcap a{font-weight:400;letter-spacing:.08em;color:var(--gold-300);text-decoration:none;border-bottom:1px dotted var(--gold-500)}
.bjs__figcap a:hover{color:var(--gold-200)}
@media (max-width:860px){.bjs__figs{grid-template-columns:1fr}.bjs__panel{padding:var(--space-4)}}

/* ================= INDEX GRID ================= */
.bjs-idx__grid{display:grid;gap:var(--space-5);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));padding:var(--space-7) 0 var(--space-9)}
.bjs-card{display:flex;flex-direction:column;text-decoration:none;background:var(--purple-800);border:var(--bw-ink) solid var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow-comic-sm);overflow:hidden;transition:transform var(--dur) var(--ease-pop),box-shadow var(--dur) var(--ease-pop)}
.bjs-card:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-comic)}
.bjs-card__media{position:relative;aspect-ratio:4/3;background:var(--purple-900);background-image:repeating-linear-gradient(45deg,rgba(230,212,131,.07) 0 10px,transparent 10px 20px);border-bottom:var(--bw-ink) solid var(--ink);overflow:hidden}
.bjs-card__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:top center;background:#fff}
.bjs-card__media.is-missing img{display:none}
.bjs-card__no{display:none;position:absolute;right:10px;bottom:4px;z-index:2;font-family:var(--font-display);font-size:var(--fs-lg);color:var(--gold-400);background:var(--ink);border:2px solid var(--gold-400);border-radius:var(--radius-pill);padding:1px 11px}
.bjs-card__b{padding:var(--space-4);display:flex;flex-direction:column;gap:6px;flex:1}
.bjs-card__b h3{font-family:var(--font-display);font-weight:400;font-size:var(--fs-2xl);line-height:1.02;margin:0;color:var(--cream);text-transform:uppercase;-webkit-text-stroke:1px var(--ink);text-shadow:3px 3px 0 var(--ink)}
.bjs-card__auth{font-family:var(--font-mono);font-size:var(--fs-2xs);letter-spacing:.1em;text-transform:uppercase;color:var(--gold-300)}
.bjs-card__hook{margin:4px 0 0;font-size:var(--fs-sm);line-height:1.5;color:var(--purple-200);text-wrap:pretty}