:root{
  --bg:#0a0807; --ink:#f4ece1; --muted:#b9ab9a; --line:rgba(244,236,225,.12);
  --fire:#ff8a2a; --fire2:#ffc15e; --maxw:1200px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--ink);font:400 17px/1.7 "Inter",system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
em{font-style:italic}

/* film grain */
.grain{position:fixed;inset:-50%;z-index:100;pointer-events:none;opacity:.07;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}25%{transform:translate(-3%,2%)}50%{transform:translate(2%,-3%)}75%{transform:translate(-2%,-1%)}100%{transform:translate(1%,3%)}}

/* nav */
.nav{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:1.1rem clamp(1.2rem,4vw,3rem);transition:.4s var(--ease)}
.nav.scrolled{background:rgba(10,8,7,.72);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:.7rem clamp(1.2rem,4vw,3rem)}
.brand{font-family:"Cinzel",serif;font-weight:900;font-size:1.3rem;text-decoration:none;letter-spacing:.1em}
.brand span{color:var(--fire)}
.nav nav a{font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;text-decoration:none;color:var(--muted);font-weight:600;transition:color .2s,background .2s}
.nav nav a:hover{color:var(--fire2)}

/* shared */
.kicker{font-size:.74rem;text-transform:uppercase;letter-spacing:.28em;font-weight:700;color:var(--fire2)}
.kicker i{color:var(--fire);font-style:normal;margin:0 .4em;opacity:.7}
.btn{display:inline-flex;align-items:center;gap:.5em;padding:.95rem 1.6rem;border-radius:2px;font-weight:700;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;transition:.25s var(--ease);border:1px solid transparent;position:relative;overflow:hidden;background:transparent;color:var(--ink);appearance:none;-webkit-appearance:none;cursor:pointer;font-family:inherit}
.btn-fire{background:linear-gradient(135deg,var(--fire),#ff5a1f);color:#140803;box-shadow:0 10px 30px -10px rgba(255,110,30,.7)}
.btn-fire:hover{transform:translateY(-2px);box-shadow:0 16px 40px -10px rgba(255,110,30,.9)}
.btn-line{background:transparent;border-color:rgba(244,236,225,.3);color:var(--ink)}
.btn-line:hover{border-color:var(--fire2);color:var(--fire2)}
.cta-row,.buy{display:flex;flex-wrap:wrap;gap:.8rem}
canvas.fx{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}

/* reveal: visible unless JS marks it below the fold */
.reveal{opacity:1;transform:none}
.reveal.wait{opacity:0;transform:translateY(28px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.reveal.wait.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal,.reveal.wait{opacity:1;transform:none;transition:none}.grain,.marquee .track{animation:none}}

/* ============ HERO ============ */
.hero{position:relative;min-height:0;display:flex;flex-direction:column;justify-content:flex-start;overflow:hidden;padding:5.15rem clamp(1.2rem,4vw,3rem) 3.65rem}
.hero-bg{position:absolute;inset:0;z-index:0;
  background:
   radial-gradient(ellipse 60% 50% at 72% 55%,rgba(255,120,30,.28),transparent 70%),
   radial-gradient(ellipse 50% 60% at 15% 100%,rgba(120,30,10,.5),transparent 70%),
   linear-gradient(180deg,#0a0807 0%,#160c06 60%,#0a0807 100%)}
.hero-bg::after{content:"";position:absolute;inset:0;background:url('images/jang-and-tom-wagon-masters.jpg') center 30%/cover;opacity:.12;filter:blur(18px) saturate(1.3);mix-blend-mode:screen}
.hero-inner{position:relative;z-index:2;max-width:var(--maxw);width:100%;margin:auto;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);column-gap:clamp(1.5rem,4vw,3rem);row-gap:.75rem;align-items:start}
.hero-name{font-family:"Cinzel",serif;font-weight:900;line-height:.9;margin:.55rem 0 .85rem;font-size:clamp(2.6rem,5.6vw,4.8rem);letter-spacing:-.01em;text-transform:uppercase}
.hero-name span{display:block;color:#fff4df;-webkit-text-fill-color:#fff4df;background:none;text-shadow:0 2px 18px rgba(0,0,0,.55)}
.hero-name span:last-child{color:#ffc56b;-webkit-text-fill-color:#ffc56b;-webkit-text-stroke:0;background:none;text-shadow:none;padding-left:.08em}
.hero-line{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(1.3rem,2.2vw,1.7rem);line-height:1.35;color:#e6d6c2;max-width:34rem}
.hero-feature{display:flex;gap:.85rem;align-items:center;margin:1rem 0 .95rem;padding:.75rem .95rem;border-left:3px solid var(--fire);background:linear-gradient(90deg,rgba(255,138,42,.16),transparent);max-width:34rem}
.hero-feature strong{display:block;font-family:"Rye",serif;font-weight:400;font-size:1.15rem;letter-spacing:.02em}
.hero-feature em{color:var(--muted);font-size:.92rem}
.badge{flex:none;font-size:.62rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;background:var(--fire);color:#140803;padding:.4rem .6rem;border-radius:2px}
.hero-stack{position:relative;height:clamp(200px,28vw,340px);perspective:1200px}
.stack{position:absolute;width:auto;height:88%;max-width:62%;object-fit:cover;object-position:center top;border-radius:4px;box-shadow:0 40px 80px -20px rgba(0,0,0,.9),0 0 0 1px rgba(255,255,255,.06)}
.s1{left:22%;top:0;z-index:3;height:100%;max-width:56%}
.s2{left:46%;top:2%;z-index:2;transform:rotate(8deg);filter:brightness(.82)}
.s3{left:0;top:10%;z-index:1;transform:rotate(-9deg);filter:brightness(.74)}
.tilt{transition:transform .25s ease-out;will-change:transform}
.marquee{position:absolute;bottom:0;left:0;right:0;z-index:2;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(10,8,7,.6);overflow:hidden;padding:.9rem 0}
.marquee .track{display:flex;gap:2.5rem;width:max-content;animation:marq 38s linear infinite;font-family:"Cinzel",serif;font-weight:700;font-size:1rem;letter-spacing:.25em;text-transform:uppercase;color:#8d7d6b;white-space:nowrap}
.marquee b{color:var(--fire)}
@keyframes marq{to{transform:translateX(-50%)}}

/* ============ BOOK PANELS ============ */
.book{position:relative;overflow:hidden;padding:clamp(5rem,10vw,8rem) clamp(1.2rem,4vw,3rem) clamp(4rem,8vw,6rem);isolation:isolate}
.book::before{content:"";position:absolute;inset:-40px;z-index:-2;background:var(--cover) center/cover;filter:blur(40px) saturate(1.4);opacity:.35;transform:scale(1.1)}
.book::after{content:"";position:absolute;inset:0;z-index:-1}
.book-inner{position:relative;z-index:2;max-width:var(--maxw);margin:auto;display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(2rem,6vw,5.5rem);align-items:center}
.book-inner.flip{grid-template-columns:1.2fr .8fr}
.book-inner.flip .cover-wrap{order:2}
.book-num{position:absolute;top:.15rem;right:.2rem;font-family:"Cinzel",serif;font-weight:900;font-size:clamp(3.2rem,6vw,5.4rem);line-height:1;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.16);pointer-events:none;z-index:0}
.flip .book-num{right:auto;left:0}
.cover-wrap{position:relative;perspective:1000px}
.cover{width:100%;max-width:400px;margin:auto;border-radius:4px;box-shadow:0 50px 90px -25px rgba(0,0,0,.95),0 0 0 1px rgba(255,255,255,.08)}
.genre{font-size:.74rem;text-transform:uppercase;letter-spacing:.28em;font-weight:700;margin-bottom:.9rem}
.title{line-height:.95;margin-bottom:1.4rem}
.title small{display:block;font-size:.42em;letter-spacing:.2em;margin-top:.6rem;opacity:.85}
.lede{font-size:1.12rem;color:#e8dccd;margin-bottom:1.2rem}
.lede.big{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(1.6rem,2.8vw,2.2rem);line-height:1.25;color:#fff}
.book-body p{color:var(--muted)}
.book-body .lede{color:#efe4d6}
.meta{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;margin:1.6rem 0 1.4rem;color:#8f8272!important}
.meta i{font-style:normal;opacity:.4;margin:0 .5em}
.review{margin:1.6rem 0 0;padding:1rem 1.3rem;border-left:2px solid currentColor;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.25rem;line-height:1.4;color:#efe4d6;background:rgba(255,255,255,.03)}
.review cite{display:block;margin-top:.5rem;font-family:"Inter",sans-serif;font-style:normal;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:#9a8c7c}

/* excerpt placeholder */
.excerpt{position:relative;z-index:2;max-width:var(--maxw);margin:clamp(3rem,6vw,4.5rem) auto 0;padding:2rem clamp(1.4rem,4vw,3rem);border:1.5px dashed rgba(255,255,255,.28);border-radius:6px;background:rgba(0,0,0,.35);backdrop-filter:blur(6px)}
.excerpt-label{font-size:.72rem;letter-spacing:.3em;text-transform:uppercase;font-weight:700;margin-bottom:.8rem}
.excerpt-body{font-family:"Cormorant Garamond",serif;font-size:1.35rem;line-height:1.6;color:#d8ccbd;font-style:italic}
.excerpt.placeholder .excerpt-body{color:#9d9083}

/* --- Western --- */
.western{background:#120a05}
.western::after{background:radial-gradient(ellipse at 30% 40%,transparent 20%,rgba(18,10,5,.85) 75%),linear-gradient(180deg,#0a0807,transparent 20%,transparent 80%,#0a0807)}
.western .genre,.western .excerpt-label{color:var(--fire2)}
.western .title{font-family:"Rye",serif;font-weight:400;font-size:clamp(3rem,7vw,5.6rem);color:#ffe2b0;text-shadow:0 4px 0 #6e2e0c,0 10px 40px rgba(255,120,30,.35)}
.western .title .amp{color:var(--fire)}
.western .title small{font-family:"Cinzel",serif;font-weight:900;color:var(--fire)}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.4rem 0}
.duo>div{padding:1.1rem 1.2rem;border:1px solid rgba(255,193,94,.22);background:rgba(255,138,42,.06);border-radius:3px}
.duo h4{font-family:"Rye",serif;font-weight:400;font-size:1.5rem;color:var(--fire2);margin-bottom:.3rem}
.duo p{font-size:.92rem}
.beats{list-style:none;display:grid;gap:.45rem;margin-top:1rem}
.beats li{padding-left:1.6rem;position:relative;color:#d6c7b4;font-size:.96rem}
.beats li::before{content:"✦";position:absolute;left:0;color:var(--fire)}
.western .review{color:#ffe2b0;border-color:var(--fire)}

/* --- Sci-fi --- */
.scifi{background:#03050f;--sf:#7fb2ff;--sf2:#c58bff}
.scifi::before{opacity:.45;filter:blur(50px) saturate(1.6) hue-rotate(-10deg)}
.scifi::after{background:radial-gradient(ellipse at 70% 50%,transparent 15%,rgba(3,5,15,.88) 70%),linear-gradient(180deg,#0a0807,transparent 18%,transparent 82%,#0a0807)}
.scifi .genre,.scifi .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif;letter-spacing:.35em}
.scifi .title{font-family:"Orbitron",sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(2.6rem,6vw,4.8rem);letter-spacing:.04em;background:linear-gradient(90deg,#e8f1ff,var(--sf) 50%,var(--sf2));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 30px rgba(127,178,255,.35))}
.signal{margin-top:1.2rem;font-family:"Orbitron",sans-serif;font-size:.95rem;letter-spacing:.06em;color:#c9d9ff!important}
.signal strong{color:#fff;text-shadow:0 0 18px var(--sf)}
.scifi .review{border-color:var(--sf);color:#dfe8ff}
.scifi .btn-fire{background:linear-gradient(135deg,#8fb8ff,#b27bff);color:#070a1c;box-shadow:0 10px 30px -10px rgba(140,160,255,.8)}
.scifi .btn-line:hover{border-color:var(--sf);color:var(--sf)}
.scifi .book-num{-webkit-text-stroke:1px rgba(127,178,255,.2)}
.scifi .excerpt{border-color:rgba(127,178,255,.35)}
.pulse-ring{position:absolute;left:50%;top:50%;width:70%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;z-index:-1}
.pulse-ring::before,.pulse-ring::after{content:"";position:absolute;inset:0;border-radius:50%;border:1px solid rgba(127,178,255,.55);animation:pulse 3.6s var(--ease) infinite}
.pulse-ring::after{animation-delay:1.8s}
@keyframes pulse{0%{transform:scale(.6);opacity:.9}100%{transform:scale(2.1);opacity:0}}

/* --- Woods --- */
.woods{background:#060b10;--ice:#bcd9ee}
.woods::before{opacity:.35;filter:blur(40px) saturate(.8)}
.woods::after{background:radial-gradient(ellipse at 30% 40%,transparent 15%,rgba(6,11,16,.9) 70%),linear-gradient(180deg,#0a0807,transparent 18%,transparent 85%,#0a0807)}
.woods .genre,.woods .excerpt-label{color:var(--ice)}
.woods .title{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(3rem,7vw,5.4rem);color:#f2f7fb;text-shadow:0 0 40px rgba(188,217,238,.35)}
.woods .title small{color:var(--ice);font-weight:700}
.woods .btn-fire{background:linear-gradient(135deg,#ff9b3d,#e2531a)}
.woods .book-num{-webkit-text-stroke:1px rgba(188,217,238,.18)}
.woods .excerpt{border-color:rgba(188,217,238,.35)}

/* ============ ABOUT ============ */
.about{position:relative;padding:clamp(5rem,10vw,8rem) clamp(1.2rem,4vw,3rem);background:radial-gradient(ellipse at 20% 50%,rgba(255,138,42,.12),transparent 60%),#0a0807;border-top:1px solid var(--line)}
.about-inner{max-width:1000px;margin:auto;display:grid;grid-template-columns:280px 1fr;gap:clamp(2rem,6vw,4.5rem);align-items:center}
.about h2{font-family:"Cinzel",serif;font-weight:900;font-size:clamp(2.4rem,5vw,3.8rem);text-transform:uppercase;line-height:1;margin:.8rem 0 1.4rem}
.about p{color:var(--muted);font-size:1.05rem}
.about .cta-row{margin-top:1.8rem}
.portrait{aspect-ratio:4/5;display:grid;place-items:center;text-align:center;border:1.5px dashed rgba(255,193,94,.45);background:repeating-linear-gradient(45deg,rgba(255,138,42,.04) 0 12px,transparent 12px 24px);color:#a08a70;font-size:.8rem;letter-spacing:.2em;font-weight:700;border-radius:3px}

/* ============ CONTACT ============ */
.contact{text-align:center;padding:clamp(5rem,10vw,8rem) 1.2rem;background:linear-gradient(180deg,#0a0807,#150b05)}
.contact h2{font-family:"Cinzel",serif;font-weight:900;font-size:clamp(2.6rem,7vw,5rem);text-transform:uppercase;line-height:1;margin:.8rem 0 1rem}
.contact p{color:var(--muted)}
.email{display:inline-block;margin-top:1.6rem;font-family:"Cormorant Garamond",serif;font-size:clamp(1.6rem,4vw,2.6rem);font-style:italic;color:var(--fire2);text-decoration:none;border-bottom:1px solid rgba(255,193,94,.4)}
.ph-tag{display:inline-block;margin-top:1rem;font-size:.68rem!important;font-weight:800;letter-spacing:.16em;background:#5a2410;color:#ffd6a8!important;padding:.35rem .7rem;border-radius:2px}

footer{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;padding:1.6rem clamp(1.2rem,4vw,3rem);border-top:1px solid var(--line);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#7b6d5e}
footer a{text-decoration:none}
footer a:hover{color:var(--fire2)}
.visit-count{color:var(--fire2);font-weight:700;letter-spacing:.14em;text-transform:none;display:flex;flex-direction:column;align-items:flex-start;gap:.35rem;line-height:1.25}
.visit-count .visit-avg{font-size:clamp(1.7rem,6vw,2.05rem);letter-spacing:.01em;line-height:1.15}
.visit-count .visit-month{font-size:clamp(1.15rem,3.6vw,1.35rem);letter-spacing:.03em;line-height:1.2}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .hero{padding-top:4.15rem;padding-bottom:3.7rem}
  .hero-inner{grid-template-columns:1fr;row-gap:.35rem}
  .hero-stack{order:-1;height:116px;max-width:200px;width:100%;margin:0 auto}
  .hero-name span:last-child{padding-left:0}
  .book-inner,.book-inner.flip{grid-template-columns:1fr}
  .book-inner.flip .cover-wrap{order:0}
  .cover{max-width:280px}
  .book-num{top:-3.5rem}
  .about-inner{grid-template-columns:1fr;text-align:center}
  .portrait{max-width:220px;margin:auto}
  .about .cta-row{justify-content:center}
}
@media (max-width:520px){
  body{font-size:16px}
  .duo{grid-template-columns:1fr}
  .btn{padding:.85rem 1.2rem;font-size:.74rem}
  .hero-feature{flex-direction:column;align-items:flex-start}
}

/* ============ v3 additions ============ */
.btn-game{border-color:rgba(255,193,94,.55);color:var(--fire2)}
.parts{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0 0}
.parts span{font-family:"Cinzel",serif;font-weight:700;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;padding:.4rem .7rem;border:1px solid rgba(255,193,94,.3);color:#ffd9a0;border-radius:2px}
.excerpt-label span{opacity:.6;letter-spacing:.12em;text-transform:none;font-weight:500}
.excerpt{columns:2 22rem;column-gap:3rem}
.excerpt-label{column-span:all}
.excerpt-body p{margin-bottom:1em;font-style:normal;break-inside:avoid-column}
.excerpt-body p:first-child::first-letter{float:left;font-size:3.6em;line-height:.85;padding:.08em .12em 0 0;font-weight:700}
.western .excerpt-body p:first-child::first-letter{font-family:"Rye",serif;font-weight:400;color:var(--fire)}
.scifi .excerpt-body p:first-child::first-letter{font-family:"Orbitron",sans-serif;color:var(--sf)}
.woods .excerpt-body p:first-child::first-letter{font-family:"Cinzel",serif;color:var(--ice)}
.smallcaps{font-variant:small-caps;letter-spacing:.05em}

/* gallery */
.gallery-wrap{position:relative;z-index:2;max-width:var(--maxw);margin:clamp(3rem,6vw,5rem) auto 0}
.gallery-head{max-width:40rem;margin-bottom:1.6rem}
.gallery-head .excerpt-label{color:var(--fire2)}
.gallery-head h3{font-family:"Rye",serif;font-weight:400;font-size:clamp(1.8rem,3.5vw,2.6rem);color:#ffe2b0;margin:.2rem 0 .5rem}
.gallery-head p{color:var(--muted)}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:.8rem}
.gallery figure{position:relative;overflow:hidden;border-radius:3px;aspect-ratio:16/9;box-shadow:0 20px 40px -20px #000}
.gallery .g-wide{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease),filter .5s;filter:saturate(.9)}
.gallery figure:hover img{transform:scale(1.06);filter:saturate(1.15)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;padding:1.4rem .8rem .5rem;font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:#ffe2b0;background:linear-gradient(transparent,rgba(0,0,0,.8))}

/* first pulse extras */
.fp-extras{position:relative;z-index:2;max-width:var(--maxw);margin:clamp(3rem,6vw,4.5rem) auto 0;display:grid;grid-template-columns:1.25fr 1fr;gap:1.4rem}
.game-card{display:grid;text-decoration:none;border:1px solid rgba(127,178,255,.35);border-radius:6px;overflow:hidden;background:rgba(3,5,15,.6);backdrop-filter:blur(6px);transition:.35s var(--ease)}
.game-card:hover{transform:translateY(-4px);box-shadow:0 20px 60px -20px rgba(127,178,255,.6)}
.game-shot{position:relative;aspect-ratio:16/8;overflow:hidden}
.game-shot img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.game-card:hover .game-shot img{transform:scale(1.05)}
.live{position:absolute;top:.8rem;left:.8rem;font-size:.66rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;background:rgba(3,5,15,.8);color:#9fffc8;padding:.35rem .6rem;border-radius:2px}
.game-text{padding:1.4rem 1.6rem 1.7rem}
.game-text .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif}
.game-text h3{font-family:"Cormorant Garamond",serif;font-size:2rem;font-weight:500;margin:.2rem 0 .4rem;color:#f5efe6}
.game-text p{color:#b9c3dc;margin-bottom:1.2rem}
.teaser{display:flex}
.teaser-slot{flex:1;display:flex;flex-direction:column;justify-content:center;padding:2rem;border:1.5px dashed rgba(127,178,255,.4);border-radius:6px;background:rgba(3,5,15,.5);color:#9aa6c2;font-size:.95rem}
.teaser-slot .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif}
.teaser-slot code{color:#cfe0ff;font-size:.85em}
.teaser video{width:100%;border-radius:6px;border:1px solid rgba(127,178,255,.35);background:#000;align-self:center}
.scene-strip{position:relative;z-index:2;max-width:var(--maxw);margin:2.2rem auto 0;display:grid;grid-template-columns:repeat(5,1fr);gap:.5rem}
.scene-strip img{aspect-ratio:16/9;object-fit:cover;border-radius:3px;opacity:.85;transition:.4s}
.scene-strip img:hover{opacity:1;transform:translateY(-3px)}
.strip-cap{position:relative;z-index:2;max-width:var(--maxw);margin:.6rem auto 0;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:#6f7a94}

/* rusty stack – steampunk */
.rusty{position:relative;overflow:hidden;padding:clamp(5rem,10vw,7.5rem) clamp(1.2rem,4vw,3rem);
  background:radial-gradient(ellipse at 70% 20%,rgba(214,150,70,.22),transparent 55%),
             radial-gradient(ellipse at 10% 90%,rgba(120,60,25,.4),transparent 60%),
             linear-gradient(180deg,#0a0807,#1a110a 30%,#150d08 80%,#0a0807);
  border-top:1px solid rgba(214,160,90,.25)}
.rusty::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.25;
  background-image:radial-gradient(circle at 12px 12px,rgba(214,160,90,.6) 2px,transparent 2.5px);background-size:48px 48px;
  mask-image:linear-gradient(180deg,transparent,#000 20%,#000 80%,transparent)}
.gear{position:absolute;fill:rgba(200,140,70,.12);pointer-events:none}
.gear svg{width:100%;height:100%;animation:spin 40s linear infinite}
.g1{width:340px;height:340px;top:-90px;right:-90px}
.g2{width:180px;height:180px;top:170px;right:190px}.g2 svg{animation-direction:reverse;animation-duration:22s}
.g3{width:260px;height:260px;bottom:-80px;left:-70px}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.gear svg{animation:none}}
.rusty-inner{position:relative;z-index:2;max-width:var(--maxw);margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.rusty-art{position:relative;border-radius:4px;overflow:hidden;box-shadow:0 40px 80px -30px #000;border:6px solid transparent;
  background:linear-gradient(#1a110a,#1a110a) padding-box,linear-gradient(135deg,#f3cf8a,#9a6428 40%,#e8b56a 60%,#6b3f16) border-box}
.rusty-art img{width:100%;filter:sepia(.25) contrast(1.05)}
.soon{position:absolute;top:1.1rem;right:-2.8rem;transform:rotate(35deg);background:linear-gradient(#c2471b,#8f2e0e);color:#fff3e6;font-weight:800;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;padding:.45rem 3rem;box-shadow:0 4px 12px rgba(0,0,0,.5)}
.rusty-kicker{font-family:"Special Elite",monospace;font-size:.85rem;letter-spacing:.12em;color:#d9a55e;text-transform:uppercase}
.rusty h2{font-family:"IM Fell English SC",serif;font-weight:400;font-size:clamp(3rem,7vw,5.4rem);line-height:.9;margin:.8rem 0 1.2rem;
  background:linear-gradient(180deg,#fbe3b0 0%,#d9a55e 45%,#8a5520 100%);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 3px 0 #3a1c08)}
.rusty h2 small{display:block;font-size:.4em;letter-spacing:.35em;margin-top:.4rem}
.rusty-tease{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(1.25rem,2vw,1.5rem);line-height:1.4;color:#f0dcc0}
.rusty-game{margin-top:1rem;color:var(--muted);font-size:.95rem}
.rusty-game strong{font-family:"Special Elite",monospace;font-weight:400;color:#d9a55e;letter-spacing:.05em}
.btn-brass{background:linear-gradient(180deg,#f3cf8a,#c58a3d 50%,#8a5520);color:#2a1605;border:1px solid #5a3510;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 10px 30px -10px rgba(214,150,70,.7)}
.btn-brass:hover{transform:translateY(-2px);filter:brightness(1.08)}
.rusty .cta-row{margin-top:1.8rem}
.rusty-excerpt{background:linear-gradient(180deg,rgba(243,226,190,.07),rgba(243,226,190,.03));border:1.5px solid rgba(214,160,90,.35);border-radius:3px}
.rusty-excerpt .excerpt-label{color:#d9a55e;font-family:"Special Elite",monospace}
.rusty-excerpt .excerpt-body{font-family:"Special Elite",monospace;font-size:1.02rem;line-height:1.75;color:#e6d3b5}
.rusty-excerpt .excerpt-body p:first-child::first-letter{font-family:"IM Fell English SC",serif;color:#d9a55e;font-weight:400}

@media (max-width:900px){
  .fp-extras,.rusty-inner{grid-template-columns:1fr}
  .gallery{grid-template-columns:repeat(2,1fr)}
  .scene-strip{grid-template-columns:repeat(3,1fr)}
  .scene-strip img:nth-child(n+4){display:none}
  .g2{display:none}
}
.socials{margin-top:2rem;display:flex;justify-content:center}
.foot-links{display:flex;gap:1.6rem}
/* from X */
.fromx{padding:clamp(4rem,8vw,6rem) clamp(1.2rem,4vw,3rem);border-top:1px solid var(--line);background:#0a0807}
.fromx-inner{max-width:1000px;margin:auto;display:grid;grid-template-columns:1fr 1fr;gap:2rem;align-items:center}
.fromx-card{padding:2rem;border:1px solid var(--line);border-radius:10px;background:linear-gradient(160deg,rgba(255,255,255,.04),transparent)}
.fromx-head{display:flex;gap:.9rem;align-items:center;margin-bottom:1.2rem}
.xlogo{width:48px;height:48px;display:grid;place-items:center;border-radius:50%;background:#fff;color:#000;font-size:1.4rem;font-weight:700}
.fromx-head strong{display:block}.fromx-head span{color:var(--muted);font-size:.9rem}
.fromx-bio{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.6rem;line-height:1.3;margin-bottom:1.5rem}
.fromx-bio cite{display:block;font-family:"Inter",sans-serif;font-style:normal;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:#8f8272;margin-top:.6rem}
.fromx-feed{min-height:120px;display:grid;place-items:center;border:1px dashed var(--line);border-radius:10px;padding:1rem}
.fromx-feed>a{color:var(--fire2);font-weight:600;text-decoration:none}
@media (max-width:900px){.fromx-inner{grid-template-columns:1fr}}

/* ============ v4: art gallery, lightbox, cinematic hero ============ */
.art{padding:clamp(5rem,10vw,7.5rem) clamp(1.2rem,4vw,3rem);border-top:1px solid var(--line);background:radial-gradient(ellipse at 50% 0%,rgba(255,138,42,.1),transparent 60%),#0a0807}
.art-head{max-width:var(--maxw);margin:0 auto 2.4rem}
.art h2{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(2.4rem,6vw,4.6rem);line-height:.95;margin:.8rem 0 1rem}
.art-head>p:not(.kicker){color:var(--muted);max-width:40rem;font-size:1.05rem}
.art-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.6rem}
.art-filters button{font:600 .72rem/1 "Inter",sans-serif;letter-spacing:.16em;text-transform:uppercase;padding:.75rem 1.05rem;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;transition:.2s}
.art-filters button:hover,.art-filters button:focus-visible{color:var(--fire2);border-color:var(--fire2)}
.art-filters button.on{background:var(--fire);border-color:var(--fire);color:#140803}
.art-grid{max-width:var(--maxw);margin:auto;columns:3 300px;column-gap:.8rem}
.art-item{break-inside:avoid;margin-bottom:.8rem;position:relative;overflow:hidden;border-radius:4px;box-shadow:0 20px 40px -24px #000}
.art-item img{width:100%;transition:transform .9s var(--ease)}
.art-item:hover img{transform:scale(1.05)}
.art-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:2rem .9rem .6rem;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:#f4ece1;background:linear-gradient(transparent,rgba(0,0,0,.85));opacity:0;transform:translateY(8px);transition:.35s var(--ease)}
.art-item:hover figcaption{opacity:1;transform:none}
.art-item.hide{display:none}
.photo-slot{aspect-ratio:16/9;display:grid;place-items:center;text-align:center;padding:1.5rem;border:1.5px dashed rgba(255,193,94,.4);color:#a08a70;font-size:.8rem;letter-spacing:.12em;font-weight:700}
.photo-slot code{color:#ffd9a0}
.zoomable{cursor:zoom-in}
.lightbox{position:fixed;inset:0;z-index:200;background:rgba(5,4,3,.96);display:grid;grid-template-columns:auto 1fr auto;grid-template-rows:1fr auto;align-items:center;justify-items:center;padding:2.5rem 1rem;backdrop-filter:blur(8px)}
.lightbox[hidden]{display:none}
.lightbox img{grid-column:2;max-width:min(1400px,88vw);max-height:82vh;border-radius:4px;box-shadow:0 30px 80px #000;animation:lbin .35s var(--ease)}
@keyframes lbin{from{opacity:0;transform:scale(.96)}}
.lightbox p{grid-column:1/-1;margin-top:1rem;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);text-align:center}
.lightbox button{background:none;border:0;color:#fff;cursor:pointer;font-size:3rem;line-height:1;padding:.5rem 1rem;opacity:.7}
.lightbox button:hover,.lightbox button:focus-visible{opacity:1;color:var(--fire2)}
.lb-close{position:absolute;top:.6rem;right:1rem}

/* cinematic hero slideshow */
.hero-slides{position:absolute;inset:0;z-index:0;overflow:hidden}
.slide{position:absolute;inset:-4%;background-size:cover;background-position:center 42%;opacity:0;filter:brightness(1.28) saturate(1.12) contrast(1.04);animation:kb 28s linear infinite}
.slide:nth-child(2){animation-delay:7s}.slide:nth-child(3){animation-delay:14s}.slide:nth-child(4){animation-delay:21s}
@keyframes kb{0%{opacity:1;transform:scale(1.02) translate(0,0)}8%{opacity:1}25%{opacity:1}32%{opacity:0;transform:scale(1.12) translate(-2%,-1%)}100%{opacity:0}}
.hero-slides + .hero-bg{background:
   linear-gradient(90deg,rgba(28,16,8,.55) 0%,rgba(22,12,6,.28) 42%,rgba(16,9,5,.12) 74%,rgba(10,8,7,.28) 100%),
   linear-gradient(180deg,rgba(10,8,7,.28) 0%,transparent 24%,transparent 70%,rgba(10,8,7,.92) 100%)}
.hero-slides + .hero-bg::after{display:none}
.hero-credit{position:absolute;right:clamp(1.2rem,4vw,3rem);bottom:4.4rem;z-index:2;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(244,236,225,.45)}
@media (prefers-reduced-motion:reduce){.slide{animation:none}.slide:first-child{opacity:1}}
@media (max-width:900px){.hero-slides + .hero-bg{background:linear-gradient(180deg,rgba(18,10,6,.35) 0%,rgba(16,9,6,.55) 46%,rgba(10,8,7,.92) 100%)}}
:focus-visible{outline:2px solid var(--fire2);outline-offset:3px}
.gallery .g-row{grid-column:span 2;aspect-ratio:auto;height:100%}
.hero-text{position:relative;z-index:3;padding:1.05rem 1.15rem 1.15rem;border-radius:8px;background:linear-gradient(180deg,rgba(24,13,7,.84),rgba(18,10,6,.72));border:1px solid rgba(255,193,94,.28);box-shadow:0 18px 44px -28px #000}
.gallery{grid-auto-rows:1fr}
.gallery figure{aspect-ratio:auto;min-height:0}
.gallery figure:not(.g-wide){aspect-ratio:16/9}
.gallery .g-row{aspect-ratio:auto}
@media (max-width:900px){.gallery .g-row,.gallery .g-wide{grid-column:span 2;grid-row:auto;aspect-ratio:16/9}}
/* collapsible excerpts */
.excerpt.collapsible .excerpt-body{max-height:24rem;overflow:hidden;position:relative;transition:max-height .8s var(--ease)}
.excerpt.collapsible:not(.open) .excerpt-body{-webkit-mask-image:linear-gradient(#000 65%,transparent);mask-image:linear-gradient(#000 65%,transparent)}
.excerpt.open .excerpt-body{max-height:400rem}
.more{column-span:all;margin-top:1rem;background:none;border:1px solid rgba(255,255,255,.3);color:inherit;font:700 .72rem/1 "Inter",sans-serif;letter-spacing:.16em;text-transform:uppercase;padding:.8rem 1.2rem;border-radius:2px;cursor:pointer}
.more:hover,.more:focus-visible{border-color:var(--fire2);color:var(--fire2)}
@media (max-width:900px){
  .hero-name{font-size:clamp(2.15rem,10vw,3rem);margin:.35rem 0 .55rem}
  .hero-name span:last-child{padding-left:0}
  .hero-stack{order:-1;height:116px;max-width:200px;margin:0 auto}
  .excerpt.collapsible .excerpt-body{max-height:20rem}
}
/* gallery: fixed-row bento (final) */
.gallery{grid-auto-rows:clamp(110px,11.5vw,158px)}
.gallery figure,.gallery figure:not(.g-wide),.gallery .g-row{aspect-ratio:auto!important;height:100%}
.gallery .g-wide{grid-column:span 2;grid-row:span 2}
.gallery .g-row{grid-column:span 2;grid-row:span 1}
@media (max-width:900px){.gallery{grid-auto-rows:clamp(90px,28vw,200px)}.gallery .g-wide,.gallery .g-row{grid-column:span 2;grid-row:span 2}}
.bio-src{font-size:.68rem!important;letter-spacing:.16em;text-transform:uppercase;color:#7b6d5e!important;margin-top:.6rem}
.teaser-fig{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.8rem;margin:0}
.teaser-fig .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif}
.teaser-fig video{width:100%;height:auto;aspect-ratio:16/9;border-radius:6px;border:1px solid rgba(127,178,255,.35);background:#000;box-shadow:0 30px 60px -25px rgba(90,130,255,.5)}
/* columns on the body so the toggle button sits below the text */
.excerpt{columns:auto}
.excerpt-body{columns:2 22rem;column-gap:3rem}
.about-grok{margin-top:1.2rem;font-size:.98rem!important}
/* author-as-Jang portrait */
.portrait-fig{margin:0}
.portrait-img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 20%;border-radius:3px;border:6px solid transparent;
  background:linear-gradient(#1a110a,#1a110a) padding-box,linear-gradient(135deg,#f3cf8a,#9a6428 45%,#e8b56a 60%,#6b3f16) border-box;box-shadow:0 30px 60px -25px #000;transform:rotate(-2deg)}
.portrait-fig figcaption{margin-top:1rem;text-align:center;font-family:"Rye",serif;font-size:.95rem;color:#ffd9a0;transform:rotate(-2deg)}
@media (max-width:900px){.portrait-fig{max-width:240px;margin:auto}}
/* Jang & Tom game card */
.jt-game{position:relative;z-index:2;max-width:var(--maxw);margin:clamp(3rem,6vw,4.5rem) auto 0;display:grid;grid-template-columns:260px 1fr;gap:clamp(1.5rem,4vw,3rem);align-items:center;padding:clamp(1.2rem,3vw,2rem);text-decoration:none;border:1px solid rgba(255,193,94,.3);border-radius:8px;background:linear-gradient(120deg,rgba(255,138,42,.1),rgba(0,0,0,.35));transition:.35s var(--ease)}
.jt-game:hover{transform:translateY(-4px);box-shadow:0 24px 60px -24px rgba(255,120,30,.6)}
.jt-shot{margin:0}
.jt-shot img{width:100%;border-radius:22px;border:6px solid #1d1d1f;box-shadow:0 30px 60px -20px #000}
.jt-shot figcaption{margin-top:.6rem;text-align:center;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:#9b8b79}
.jt-text .excerpt-label{color:var(--fire2)}
.jt-text h3{font-family:"Rye",serif;font-weight:400;font-size:clamp(1.8rem,3.5vw,2.6rem);color:#ffe2b0;margin:.3rem 0 .8rem}
.jt-quote{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:1.3rem;line-height:1.4;color:#efe4d6;margin-bottom:1.4rem}
.jt-quote cite{display:block;margin-top:.4rem;font-family:"Inter",sans-serif;font-style:normal;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;color:#9b8b79}
@media (max-width:700px){.jt-game{grid-template-columns:1fr;text-align:center}.jt-shot{max-width:220px;margin:auto}}
.portrait-img{height:auto}
.jt-shot img{height:auto}
.jt-game{grid-template-columns:210px 1fr}
/* gallery: even grid (no photo tile) */
.art-grid{columns:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem}
.art-item{margin-bottom:0;aspect-ratio:16/9}
.art-item img{height:100%;object-fit:cover}
@media (max-width:900px){.art-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.art-grid{grid-template-columns:1fr}}
/* Jason's own work */
.own{position:relative;padding:clamp(5rem,10vw,7.5rem) clamp(1.2rem,4vw,3rem);border-top:1px solid var(--line);
  background:radial-gradient(ellipse at 80% 10%,rgba(120,170,120,.12),transparent 55%),radial-gradient(ellipse at 10% 80%,rgba(255,138,42,.08),transparent 60%),#0b0a08}
.own-inner{max-width:var(--maxw);margin:auto}
.own-head{margin-bottom:2rem}
.own h2{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(2.4rem,6vw,4.6rem);line-height:.95;margin:.8rem 0 1rem}
.own-head>p:not(.kicker){color:var(--muted);font-size:1.05rem;max-width:40rem}
.own-video{margin:0 0 3.5rem}
.own-video video{width:100%;height:auto;aspect-ratio:16/9;border-radius:6px;background:#000;border:1px solid var(--line);box-shadow:0 40px 80px -30px #000}
.own-video figcaption,.own-credit{margin-top:.8rem;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#a89a88}
.own-sub{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500;font-size:clamp(1.8rem,3vw,2.4rem);margin-bottom:1.2rem}
.photo-grid{columns:3 260px;column-gap:.8rem}
.photo-item{break-inside:avoid;margin:0 0 .8rem;position:relative;overflow:hidden;border-radius:4px;box-shadow:0 20px 40px -24px #000}
.photo-item img{width:100%;height:auto;transition:transform .9s var(--ease)}
.photo-item:hover img{transform:scale(1.04)}
.photo-item figcaption{position:absolute;left:0;right:0;bottom:0;padding:2rem .9rem .6rem;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:#f4ece1;background:linear-gradient(transparent,rgba(0,0,0,.85));opacity:0;transition:.35s var(--ease)}
.photo-item:hover figcaption,.photo-item:focus-within figcaption{opacity:1}

/* ===== First Pulse audiobook player ===== */
.audiobook{position:relative;z-index:2;max-width:var(--maxw);margin:1.4rem auto 0;padding:clamp(1.1rem,2.5vw,1.6rem);border:1px solid rgba(127,178,255,.35);border-radius:6px;background:rgba(3,5,15,.6);backdrop-filter:blur(6px)}
.audiobook .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif;letter-spacing:.35em;margin-bottom:.4rem}
.ab-note{color:#9aa6c2;font-size:.95rem;margin-bottom:1.1rem}
.ab-body{display:grid;grid-template-columns:minmax(0,1fr) 13rem;gap:1.2rem;align-items:start}
.ab-player{margin:0}
.ab-player video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:6px;border:1px solid rgba(127,178,255,.35);background:#000}
.ab-now{margin-top:.6rem;font-size:.85rem;color:#9aa6c2}
.ab-now span{color:#dfe8ff}
.ab-list{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.ab-part{width:100%;display:flex;justify-content:space-between;align-items:center;gap:.8rem;padding:.7rem .9rem;font:inherit;font-size:.9rem;color:#cfd8ee;background:rgba(127,178,255,.06);border:1px solid rgba(127,178,255,.25);border-radius:4px;cursor:pointer;transition:.25s var(--ease)}
.ab-part:hover,.ab-part:focus-visible{border-color:var(--sf);color:#fff;outline:none}
.ab-part.on{background:linear-gradient(135deg,rgba(143,184,255,.22),rgba(178,123,255,.22));border-color:var(--sf);color:#fff}
.ab-n{font-family:"Orbitron",sans-serif;font-size:.78rem;letter-spacing:.15em;text-transform:uppercase}
.ab-t{font-variant-numeric:tabular-nums;opacity:.7;font-size:.85rem}
.ab-part.on .ab-n::before{content:"▶ ";color:var(--sf)}
@media (max-width:900px){
  .ab-body{grid-template-columns:1fr}
  .ab-list{grid-template-columns:repeat(auto-fill,minmax(6.5rem,1fr))}
  .ab-part{flex-direction:column;align-items:flex-start;gap:.15rem;padding:.6rem .7rem}
}

/* ============ v5: grouped nav ============ */
.nav nav{display:flex;align-items:center;gap:.15rem}
.nav-link,.nav-label{display:inline-flex;align-items:center;gap:.4rem;padding:.65rem .8rem;background:transparent;border:0;color:var(--muted);font:600 .78rem/1 "Inter",system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer;border-radius:3px;appearance:none;-webkit-appearance:none}
.nav-label::after{content:"";width:0;height:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor;opacity:.75}
.nav-link:hover,.nav-label:hover,.nav-link:focus-visible,.nav-label:focus-visible{color:var(--fire2)}
.nav-link.on,.nav-label.on{color:var(--fire2)}
.nav-link.on{box-shadow:inset 0 -2px 0 var(--fire)}
.nav-group{position:relative}
.nav-menu{display:none;position:absolute;top:calc(100% - 4px);left:0;z-index:80;min-width:14.5rem;padding:.45rem .35rem .35rem;background:rgba(12,9,7,.97);border:1px solid rgba(244,236,225,.16);border-radius:6px;box-shadow:0 18px 40px -18px #000}
.nav-menu a{display:block;margin:0;padding:.7rem .85rem;border-radius:3px;color:var(--ink)}
.nav-menu a:hover,.nav-menu a:focus-visible{background:rgba(255,138,42,.12);color:var(--fire2)}
.nav-menu a.on{color:var(--fire2);background:rgba(255,138,42,.1)}
.pwa-home{display:none;align-items:center;justify-content:center;margin-left:auto;margin-right:.5rem;width:40px;height:40px;padding:0;border-radius:50%;border:1px solid rgba(255,193,94,.55);background:rgba(255,138,42,.16);color:var(--ink);text-decoration:none;flex:none}
.pwa-home svg{display:block;flex:none}
.nav-toggle{display:none;background:transparent;color:var(--ink);border:1px solid rgba(244,236,225,.3);border-radius:3px;width:44px;height:40px;cursor:pointer;padding:0 10px;flex-direction:column;justify-content:center;gap:5px;appearance:none;-webkit-appearance:none}
.nav-toggle span{display:block;height:2px;background:var(--ink);transition:.3s var(--ease)}
.nav.open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .nav-toggle span:nth-child(2){opacity:0}
.nav.open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
body:not(.home) .nav{background:rgba(10,8,7,.72);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
@media (min-width:861px){
  .nav-group.is-open>.nav-menu{display:grid}
  .nav-group.is-open>.nav-label::after{transform:rotate(180deg)}
}
@media (min-width:861px) and (hover:hover) and (pointer:fine){
  .nav-group:hover>.nav-menu{display:grid}
  .nav-group:hover>.nav-label::after{transform:rotate(180deg)}
}
@media (max-width:860px){
  .pwa-home{display:inline-flex}
  .nav-toggle{display:flex}
  .nav nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;padding:.35rem clamp(1.2rem,4vw,3rem) 1rem;background:rgba(10,8,7,.98);border-bottom:1px solid var(--line);max-height:calc(100vh - 4rem);overflow-y:auto}
  .nav.open{background:rgba(10,8,7,.98)}
  .nav.open nav{display:flex}
  .nav-link,.nav-label{width:100%;justify-content:space-between;padding:.95rem 0;font-size:.92rem;border-bottom:1px solid var(--line);border-radius:0}
  .nav-link.on{box-shadow:none}
  .nav-link.on::before,.nav-menu a.on::before{content:"▸ ";color:var(--fire)}
  .nav-menu{position:static;min-width:0;padding:0 0 .2rem .15rem;background:transparent;border:0;border-radius:0;box-shadow:none}
  .nav-group.is-open>.nav-menu{display:grid}
  .nav-group.is-open>.nav-label{color:var(--fire2)}
  .nav-group.is-open>.nav-label::after{transform:rotate(180deg)}
  .nav-menu a{padding:.8rem .2rem .8rem .85rem;border-bottom:1px solid var(--line);font-size:.85rem}
}
.page-book main > section:first-child{padding-top:clamp(5.5rem,8vw,6.6rem)}

/* home: book cards + teasers */
.home-books{padding:1.35rem clamp(1.2rem,4vw,3rem) clamp(2.6rem,5vw,4rem);border-top:1px solid var(--line)}
.home-more{padding:0 clamp(1.2rem,4vw,3rem) clamp(4rem,8vw,6rem);border-top:0}
.home-inner{max-width:var(--maxw);margin:auto}
.home-h{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(2.4rem,6vw,4.2rem);line-height:.95;margin:.8rem 0 2rem}
.bcards{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.bcard{display:flex;flex-direction:column;text-decoration:none;border:1px solid var(--line);border-radius:6px;overflow:hidden;background:rgba(255,255,255,.02);transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease),opacity .9s var(--ease)}
.bcard:hover,.bcard:focus-visible{transform:translateY(-5px);box-shadow:0 24px 60px -24px rgba(255,120,30,.55);border-color:rgba(255,193,94,.45)}
.bcard-img{display:block;aspect-ratio:2/3;overflow:hidden;background:#000}
.bcard-img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.bcard:hover .bcard-img img{transform:scale(1.04)}
.bcard-brass .bcard-img{position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate;background:#120c06}
.bcard-brass .bcard-img::before{content:"";position:absolute;inset:-24px;z-index:-1;background:url("images/rusty-stack-game.jpg") center/cover;filter:blur(16px) brightness(.5) sepia(.5)}
.bcard-brass .bcard-img img{position:relative;height:auto;object-fit:contain;filter:sepia(.25) contrast(1.05);box-shadow:0 14px 34px -10px #000}
.bcard-brass .soon{top:.9rem;right:-3.1rem;font-size:.6rem;padding:.4rem 3rem}
@media (max-width:460px){.bcard-brass .soon{top:.7rem;right:-2.4rem;font-size:.48rem;letter-spacing:.14em;padding:.28rem 3rem}}
.bcard-text{display:flex;flex-direction:column;gap:.35rem;padding:1.1rem 1.2rem 1.3rem;flex:1;min-width:0}
.bcard-genre{font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:var(--fire2)}
.bcard-title{font-size:1.6rem;line-height:1.05;font-weight:400}
.bcard-title small{display:block;font-size:.55em;letter-spacing:.16em;margin-top:.3rem}
.bcard em{font-family:"Cormorant Garamond",serif;font-size:1.15rem;color:#e6d6c2}
.bcard-go{margin-top:auto;padding-top:.6rem;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.bcard:hover .bcard-go{color:var(--fire2)}
.bcard-western .bcard-title{font-family:"Rye",serif;color:#ffe2b0}
.bcard-western .bcard-title small{font-family:"Cinzel",serif;font-weight:900;color:var(--fire)}
.bcard-scifi .bcard-genre{color:#7fb2ff;font-family:"Orbitron",sans-serif}
.bcard-scifi .bcard-title{font-family:"Orbitron",sans-serif;font-weight:900;text-transform:uppercase;font-size:1.3rem}
.bcard-woods .bcard-genre{color:#bcd9ee}
.bcard-woods .bcard-title{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase}
.bcard-woods .bcard-title small{color:#bcd9ee}
.bcard-brass .bcard-genre{color:#d9a55e;font-family:"Special Elite",monospace;letter-spacing:.1em}
.bcard-brass .bcard-title{font-family:"IM Fell English SC",serif;color:#f3cf8a}
.more-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.mcard{display:grid;grid-template-rows:auto 1fr;text-decoration:none;border:1px solid var(--line);border-radius:6px;overflow:hidden;transition:transform .35s var(--ease),border-color .35s var(--ease),opacity .9s var(--ease);background:rgba(255,255,255,.02)}
.mcard:hover,.mcard:focus-visible{transform:translateY(-4px);border-color:rgba(255,193,94,.45)}
.mcard-img{display:block;aspect-ratio:16/9;overflow:hidden}
.mcard-img img{width:100%;height:100%;object-fit:cover;object-position:50% 25%}
.mcard-text{display:flex;flex-direction:column;gap:.35rem;padding:1.1rem 1.2rem 1.3rem}
.mcard strong{font-family:"Cinzel",serif;font-weight:900;font-size:1.4rem;text-transform:uppercase;line-height:1.1}
.mcard em{color:var(--muted);font-size:.95rem}
@media (max-width:1000px){.bcards{grid-template-columns:repeat(2,1fr)}}
@media (max-width:760px){.more-grid{grid-template-columns:1fr}}
@media (max-width:460px){.bcards{grid-template-columns:1fr}.bcard{flex-direction:row}.bcard-img{width:38%;flex:none;aspect-ratio:auto;min-height:100%}}

/* audiobook links on book pages */
.ab-link{position:relative;z-index:2;max-width:var(--maxw);margin:1.4rem auto 0;display:grid;grid-template-columns:220px 1fr;gap:1.4rem;align-items:center;padding:1rem;text-decoration:none;border:1px solid rgba(127,178,255,.35);border-radius:6px;background:rgba(3,5,15,.6);transition:.35s var(--ease)}
.ab-link img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:4px}
.ab-link .excerpt-label{display:block;margin-bottom:.3rem}
.ab-link strong{display:block;font-size:1.25rem;color:#fff}
.ab-link-west{margin-top:clamp(2rem,4vw,3rem);border-color:rgba(255,193,94,.35);background:rgba(18,10,5,.6)}
.ab-link-west .excerpt-label{color:var(--fire2)}
.ab-link-west strong{font-family:"Rye",serif;font-weight:400;color:#ffe2b0}
.ab-link-west:hover{transform:translateY(-3px);box-shadow:0 20px 60px -20px rgba(255,120,30,.6)}
@media (max-width:640px){.ab-link{grid-template-columns:1fr}}
.ab-more{position:relative;z-index:2;max-width:var(--maxw);margin:.9rem auto 0;font-size:.85rem;color:#9aa6c2}
.ab-more a{color:var(--sf);text-decoration:none}
.ab-more a:hover{text-decoration:underline}

/* audiobooks page */
.ab-page{padding:clamp(7rem,12vw,9rem) clamp(1.2rem,4vw,3rem) clamp(4rem,8vw,6rem);background:radial-gradient(ellipse at 50% 0%,rgba(255,138,42,.1),transparent 60%),#0a0807}
.ab-page-inner{max-width:var(--maxw);margin:auto}
.page-head h1{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;font-size:clamp(2.6rem,7vw,5rem);line-height:.95;margin:.8rem 0 1rem}
.page-head>p:not(.kicker){color:var(--muted);max-width:44rem;font-size:1.05rem}
.page-head a{color:var(--fire2)}
.ab-jump{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.ab-jump a{font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;text-decoration:none;padding:.6rem 1rem;border:1px solid rgba(244,236,225,.25);border-radius:999px;color:var(--ink)}
.ab-jump a:hover{border-color:var(--fire2);color:var(--fire2)}
.ab-book{margin-top:clamp(3rem,6vw,4.5rem);scroll-margin-top:5rem}
.ab-book-head{display:grid;grid-template-columns:120px 1fr;gap:1.4rem;align-items:center;margin-bottom:1.4rem}
.ab-cover{width:100%;border-radius:3px;box-shadow:0 20px 40px -16px #000}
.ab-h{line-height:1;margin:.2rem 0 .8rem}
.ab-h small{display:inline-block;font-size:.45em;letter-spacing:.18em;margin-left:.4rem}
.western-h{font-family:"Rye",serif;font-weight:400;font-size:clamp(2rem,5vw,3.2rem);color:#ffe2b0}
.western-h .amp{color:var(--fire)}
.western-h small{font-family:"Cinzel",serif;font-weight:900;color:var(--fire)}
.scifi-h{font-family:"Orbitron",sans-serif;font-weight:900;text-transform:uppercase;font-size:clamp(1.7rem,4.5vw,2.8rem);color:#dfe8ff}
.western-ab .ab-book-head .excerpt-label{color:var(--fire2)}
.scifi-ab{--sf:#7fb2ff;--sf2:#c58bff}
.scifi-ab .ab-book-head .excerpt-label{color:var(--sf);font-family:"Orbitron",sans-serif;letter-spacing:.35em}
.ab-book .btn{padding:.65rem 1.1rem;font-size:.7rem}
.ab-page .audiobook{margin-top:0}
.ab-tabs{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.8rem}
.ab-tabs button{font:700 .74rem/1 "Inter",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);background:none;border:1px solid rgba(244,236,225,.25);border-radius:999px;padding:.8rem 1.1rem;cursor:pointer;transition:.25s var(--ease)}
.ab-tabs button span{opacity:.6;font-weight:500;margin-left:.3rem}
.ab-tabs button:hover,.ab-tabs button:focus-visible{color:var(--fire2);border-color:var(--fire2)}
.ab-tabs button.on{background:var(--fire);border-color:var(--fire);color:#140803}
.ab-west{border-color:rgba(255,193,94,.35);background:rgba(18,10,5,.6)}
.ab-west .excerpt-label{color:var(--fire2);font-family:"Inter",sans-serif;letter-spacing:.3em}
.ab-west .ab-note{color:#b9ab9a}
.ab-west .ab-player video{border-color:rgba(255,193,94,.35)}
.ab-west .ab-now{color:#b9ab9a}.ab-west .ab-now span{color:#ffe2b0}
.ab-west .ab-part{color:#e6d6c2;background:rgba(255,138,42,.06);border-color:rgba(255,193,94,.25)}
.ab-west .ab-part:hover,.ab-west .ab-part:focus-visible{border-color:var(--fire2);color:#fff}
.ab-west .ab-part.on{background:linear-gradient(135deg,rgba(255,138,42,.25),rgba(255,193,94,.18));border-color:var(--fire)}
.ab-west .ab-n{font-family:"Cinzel",serif;font-weight:700}
.ab-west .ab-part.on .ab-n::before{color:var(--fire)}
.audiobook[hidden]{display:none}
@media (max-width:640px){.ab-book-head{grid-template-columns:80px 1fr;gap:1rem}.ab-tabs button{flex:1 1 100%;text-align:left}}
.page-about .about{padding-top:clamp(7rem,12vw,9rem);border-top:0}
.page-art .own{padding-top:clamp(7rem,12vw,9rem);border-top:0}
.more-grid{grid-template-columns:repeat(6,1fr)}
.more-grid>.mcard{grid-column:span 2}
.more-grid>.mcard:nth-child(n+4){grid-column:span 3}
@media (max-width:760px){.more-grid{grid-template-columns:1fr}.more-grid>.mcard,.more-grid>.mcard:nth-child(n+4){grid-column:auto}}

/* Rusty Stack storyboard animatic on the audiobooks page */
.brass-ab .ab-book-head{grid-template-columns:minmax(160px,280px) 1fr;align-items:center}
.brass-ab .ab-cover{aspect-ratio:16/9;object-fit:contain;filter:sepia(.25) contrast(1.05);border:4px solid transparent;
  background:linear-gradient(#120c06,#120c06) padding-box,linear-gradient(135deg,#f3cf8a,#9a6428 40%,#e8b56a 60%,#6b3f16) border-box}
.brass-ab .excerpt-label{color:#d9a55e;font-family:"Special Elite",monospace;letter-spacing:.12em}
.brass-h{font-family:"IM Fell English SC",serif;font-weight:400;font-size:clamp(2.1rem,5vw,3.4rem);line-height:.92;
  background:linear-gradient(180deg,#fbe3b0 0%,#d9a55e 50%,#8a5520 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.brass-ab .brass-h small{display:block;margin:.45rem 0 0;font-size:.4em;letter-spacing:.28em;font-weight:400}
.brass-intro{font-family:"Cormorant Garamond",serif;font-style:italic;font-size:clamp(1.2rem,2vw,1.45rem);line-height:1.4;color:#f0dcc0;margin:.15rem 0 1rem;max-width:40rem}
.rs-episodes{list-style:none;display:grid;gap:1.15rem;margin:0;padding:0}
.rs-ep{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:clamp(1rem,2.4vw,1.6rem);align-items:center;padding:clamp(.85rem,2vw,1.15rem);border:1px solid rgba(214,160,90,.35);border-radius:6px;background:linear-gradient(180deg,rgba(243,226,190,.07),rgba(26,17,10,.45))}
.rs-player{margin:0}
.rs-player video{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:4px;border:1px solid rgba(214,160,90,.4);background:#000}
.rs-copy h3{font-family:"IM Fell English SC",serif;font-weight:400;font-size:clamp(1.45rem,2.4vw,1.9rem);line-height:1.05;color:#f3cf8a;margin:.15rem 0 .5rem}
.rs-copy>p:last-child{color:#e6d3b5;font-size:.98rem}
@media (max-width:760px){
  .brass-ab .ab-book-head{grid-template-columns:1fr}
  .brass-ab .ab-cover{max-width:320px}
  .rs-ep{grid-template-columns:1fr;align-items:start}
}
.brass-ab .audiobook{border-color:rgba(214,160,90,.35);background:linear-gradient(180deg,rgba(243,226,190,.07),rgba(26,17,10,.55))}
.brass-ab .ab-player video{border-color:rgba(214,160,90,.4)}
.brass-ab .ab-now{color:#c9b59a}
.brass-ab .ab-now span{color:#f3cf8a}
.brass-ab .ab-meta{margin:.45rem 0 0;font-family:"Special Elite",monospace;font-size:.78rem;letter-spacing:.06em;color:#d9a55e}
.brass-ab .ab-synopsis{margin:.3rem 0 0;color:#e6d3b5;font-size:.98rem;line-height:1.45}
.brass-ab .ab-part{color:#e6d3b5;background:rgba(214,160,90,.08);border-color:rgba(214,160,90,.28)}
.brass-ab .ab-part:hover,.brass-ab .ab-part:focus-visible{border-color:#e8b56a;color:#fff}
.brass-ab .ab-part.on{background:linear-gradient(135deg,rgba(214,160,90,.28),rgba(138,85,32,.22));border-color:#d9a55e;color:#fff}
.brass-ab .ab-n{font-family:"Cinzel",serif;font-weight:700;letter-spacing:.12em}
.brass-ab .ab-part.on .ab-n::before{color:#f3cf8a}
.brass-ab .ab-part:disabled{opacity:.45;cursor:default;color:#b9a890}
.brass-ab .ab-part:disabled .ab-t{opacity:1}
.brass-ab .ab-part:disabled:hover,.brass-ab .ab-part:disabled:focus-visible{border-color:rgba(214,160,90,.28);color:#b9a890}
.brass-weekly{margin:-.35rem 0 .9rem;font-family:"Special Elite",monospace;font-size:.95rem;letter-spacing:.03em;color:#d9a55e}
@media (max-width:900px){
  #rusty-stack-animatic .ab-list{grid-template-columns:1fr}
  #rusty-stack-animatic .ab-part{flex-direction:row;align-items:center;justify-content:space-between;gap:.8rem}
  #rusty-stack-animatic .ab-t{white-space:nowrap}
}

/* home: six "more" cards sit in two rows of three */
@media (min-width:761px){.more-grid:has(>.mcard:nth-child(6))>.mcard{grid-column:span 2}}

.home .nav{background:linear-gradient(180deg,rgba(10,8,7,.82),rgba(10,8,7,0))}
.home .nav.scrolled{background:rgba(10,8,7,.9);backdrop-filter:blur(12px)}

/* hero actions + activity previews */
.hero-actions{margin-top:.15rem}
.hero-previews{grid-column:1 / -1;display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:.2rem}
.hero-preview{display:grid;grid-template-columns:104px 1fr;gap:.75rem;align-items:center;text-decoration:none;padding:.4rem .7rem .4rem .4rem;border:1px solid rgba(255,193,94,.32);border-radius:6px;background:rgba(14,8,5,.78);min-width:0}
.hero-preview img{width:104px;height:68px;object-fit:cover;border-radius:3px}
.hero-preview-color img{object-fit:contain;background:#fff}
.hero-preview span{display:flex;flex-direction:column;gap:.12rem;min-width:0}
.hero-preview strong{font-family:"Cinzel",serif;font-weight:900;font-size:.95rem;letter-spacing:.08em;text-transform:uppercase;line-height:1.1}
.hero-preview em{color:#e6d6c2;font-size:.92rem;line-height:1.3}
.hero-preview:hover,.hero-preview:focus-visible{border-color:var(--fire2);color:var(--fire2)}
.hero-preview:hover strong,.hero-preview:focus-visible strong{color:var(--fire2)}
@media (max-width:640px){
  .hero-text{padding:.75rem .8rem .85rem}
  .hero-line{font-size:1.05rem}
  .hero-feature{margin:.7rem 0 .7rem;padding:.55rem .7rem}
  .hero-preview{grid-template-columns:64px 1fr;gap:.4rem;padding:.3rem .45rem .3rem .3rem}
  .hero-preview img{width:64px;height:46px}
  .hero-preview strong{font-size:.72rem}
  .hero-preview em{font-size:.75rem}
  .cta-row .btn{padding:.7rem .75rem}
}

/* book pages: cover, hook, and buy links in the first screen */
.book-ready .book-inner,.book-ready .book-inner.flip{align-items:start}
.book-ready .book-body{padding:1rem 1.15rem 1.15rem;border-radius:8px;background:linear-gradient(180deg,rgba(7,8,12,.78),rgba(7,8,12,.58));border:1px solid rgba(244,236,225,.12)}
.book-ready .cover{max-width:320px}
.book-ready .book-num{font-size:clamp(2.6rem,5vw,4.2rem);top:.4rem;opacity:.55}
@media (max-width:900px){
  .book-ready .book-inner,.book-ready .book-inner.flip{grid-template-columns:108px minmax(0,1fr);gap:.85rem;align-items:start}
  .book-ready .book-inner.flip .cover-wrap{order:0}
  .book-ready .cover{max-width:108px}
  .book-ready .book-num{display:none}
  .book-ready.scifi .title{font-size:clamp(1.35rem,5.4vw,1.8rem)}
  .book-ready.woods .title{font-size:clamp(1.45rem,5.6vw,1.9rem)}
  .book-ready .lede.big{font-size:1.2rem}
  .book-ready .book-body{padding:.75rem .8rem .9rem}
  .book-ready .review{font-size:1.05rem;padding:.7rem .8rem}
}

/* milestone visit intro */
body.milestone-open{overflow:hidden}
.milestone{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:4.2rem 1rem 1.4rem;background:rgba(8,6,5,.94)}
.milestone-card{width:min(960px,100%);text-align:center}
.milestone-title{font-family:"Cinzel",serif;font-weight:900;text-transform:uppercase;letter-spacing:.04em;line-height:1.05;font-size:clamp(1.55rem,4.2vw,3rem);color:#ffc15e;text-shadow:0 2px 18px rgba(0,0,0,.55);margin:0 0 1rem}
.milestone-stage{position:relative}
.milestone video{display:block;width:100%;height:auto;aspect-ratio:16/9;background:#000;border:1px solid rgba(255,193,94,.4);border-radius:4px;box-shadow:0 30px 80px -28px #000}
.milestone-unmute{position:absolute;left:.8rem;bottom:.8rem}
.milestone-skip{position:absolute;top:1rem;right:1rem;z-index:2}

/* Venmo tip line under book and game endings */
.tip-line{margin-top:1rem;font-size:.9rem;color:var(--muted)}
.tip-line a{color:var(--fire2);text-underline-offset:.2em}
.tip-line a:hover{color:var(--ink)}
.book .buy + .tip-line{margin-top:.9rem}
.book .tip-line + p,.book .tip-line + .review{margin-top:1.3rem}