:root{--ink:#1b1530;--bg:#0b0624;--bg2:#1a0b4a;--y:#ffe14d;--c:#39e5ff;--p:#ff2a6d;--g:#1fbf6b;--v:#8a2be2;--paper:#fffaf0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Fredoka,system-ui,sans-serif;color:var(--ink);background:var(--paper);line-height:1.55;font-size:17px}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.wrap{max-width:1100px;margin:0 auto;padding:0 20px}
.bang{font-family:Bangers,Impact,sans-serif;letter-spacing:1px;font-weight:400}
nav{position:sticky;top:0;z-index:20;background:rgba(11,6,36,.92);backdrop-filter:blur(6px);color:#fff}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:60px;gap:12px}
nav .brand{font-family:Bangers;font-size:26px;color:var(--y);text-decoration:none;letter-spacing:1px}
nav .links{display:flex;gap:18px;font-weight:500}
nav .links a{text-decoration:none;opacity:.85}
.btn{display:inline-block;text-decoration:none;font-family:Bangers;letter-spacing:1px;font-size:24px;padding:12px 26px;border-radius:14px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);transition:transform .1s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 var(--ink)}
.btn-buy{background:var(--y);color:var(--ink)}
.btn-ghost{background:#fff;color:var(--ink)}
.btn-small{font-size:18px;padding:7px 16px;box-shadow:3px 3px 0 var(--ink)}
.hero{background:radial-gradient(circle at 25% 30%,#3a1670,var(--bg) 70%);color:#fff;padding:56px 0 70px;overflow:hidden}
.hero .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:40px;align-items:center}
.hero img.cover{border:6px solid #fff;border-radius:10px;transform:rotate(-4deg);box-shadow:0 25px 60px rgba(0,0,0,.6)}
.tag{display:inline-block;background:var(--p);color:#fff;font-family:Bangers;font-size:20px;padding:3px 14px;border-radius:30px;border:2px solid #fff;letter-spacing:1px}
.hero h1{font-family:Bangers;font-size:clamp(46px,7vw,80px);line-height:.95;margin:14px 0 6px;color:var(--y);text-shadow:4px 4px 0 var(--p);letter-spacing:2px}
.hero h2{font-family:Bangers;font-size:clamp(26px,3.6vw,38px);color:var(--c);margin:0 0 14px;letter-spacing:1px}
.hero p.lead{font-size:19px;opacity:.95}
.pricebox{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:22px 0 10px}
.price{font-family:Bangers;font-size:54px;color:#fff}
.was{font-family:Bangers;font-size:30px;color:#9b8fc7;text-decoration:line-through}
.note{font-size:14px;opacity:.8}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.chip{background:rgba(255,255,255,.1);border:1.5px solid rgba(255,255,255,.35);border-radius:20px;padding:3px 12px;font-size:14px}
section{padding:64px 0}
.h{font-family:Bangers;font-size:clamp(34px,5vw,48px);letter-spacing:1px;margin:0 0 8px;text-align:center}
.sub{text-align:center;max-width:720px;margin:0 auto 34px;color:#4a4560}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
.card{background:#fff;border:3px solid var(--ink);border-radius:16px;padding:18px;box-shadow:5px 5px 0 var(--ink)}
.card h3{font-family:Bangers;font-size:26px;margin:4px 0;letter-spacing:.5px}
.card .ic{font-size:34px}
.levels{background:var(--bg2);color:#fff}
.levels .sub{color:#cfc6ff}
.lv{display:flex;gap:14px;align-items:flex-start;background:rgba(255,255,255,.07);border:2px solid rgba(255,255,255,.2);border-radius:14px;padding:14px}
.lv .n{flex:0 0 52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:Bangers;font-size:26px;border:3px solid #fff}
.lv h3{margin:0;font-family:Bangers;font-size:23px;letter-spacing:.5px}
.lv p{margin:2px 0 0;font-size:15px;color:#ddd}
.previews{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.previews img{border:3px solid var(--ink);border-radius:8px;box-shadow:5px 5px 0 var(--ink);cursor:zoom-in}
.author{background:linear-gradient(135deg,#fff4fa,#e8fbff)}
.author .photo{width:260px;height:260px;border-radius:50%;border:8px solid #fff;box-shadow:0 0 0 6px var(--v),0 0 40px rgba(57,229,255,.7);margin:0 auto;object-fit:cover}
.buy{background:radial-gradient(circle at 70% 20%,#3a1670,var(--bg) 70%);color:#fff;text-align:center}
.buybox{max-width:560px;margin:0 auto;background:#fff;color:var(--ink);border-radius:22px;border:4px solid var(--y);padding:28px;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.buybox .price{color:var(--ink)}
.buybox ul{text-align:left;margin:16px auto;max-width:400px;padding-left:1.2em}
.faq details{background:#fff;border:3px solid var(--ink);border-radius:12px;padding:12px 16px;margin:10px auto;max-width:820px}
.faq summary{font-weight:600;cursor:pointer;font-size:18px}
footer{background:var(--bg);color:#bbb;padding:30px 0;font-size:14px}
footer a{color:#fff}
footer .wrap{display:flex;flex-wrap:wrap;gap:14px;justify-content:space-between}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.85);display:none;align-items:center;justify-content:center;z-index:50;padding:20px}
.lightbox img{max-height:92vh;width:auto;border-radius:8px}
.mobile-buy{display:none}
.policy{max-width:820px;margin:0 auto;padding:40px 20px}
.policy h1{font-family:Bangers;font-size:44px;letter-spacing:1px}
.policy h2{font-family:Bangers;font-size:26px;letter-spacing:.5px;margin-top:26px}
@media (max-width:820px){
  .hero .wrap,.grid2{grid-template-columns:1fr}
  .hero img.cover{max-width:270px;width:70%;margin:0 auto}
  .grid3,.previews{grid-template-columns:1fr 1fr}
  nav .links{display:none}
  .mobile-buy{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--bg);padding:10px 16px;gap:10px;align-items:center;justify-content:space-between;color:#fff;border-top:3px solid var(--y)}
  body{padding-bottom:70px}
}
@media (max-width:520px){.grid3,.previews{grid-template-columns:1fr}.btn{font-size:21px}}

.share{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:14px;font-size:14px}
.sh{text-decoration:none;font-weight:600;font-size:14px;padding:6px 12px;border-radius:20px;color:#fff;border:2px solid rgba(255,255,255,.4)}
.sh.wa{background:#25d366}.sh.fb{background:#1877f2}.sh.li{background:#0a66c2}.sh.cp{background:#555}
.flip{background:#1a0b4a;color:#fff}.flip .sub{color:#d8d0ff}
.thumbs{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:12px}
.th{position:relative;border:3px solid #fff;border-radius:6px;padding:0;background:#000;cursor:pointer;overflow:hidden;aspect-ratio:794/1123}
.th img{width:100%;height:100%;object-fit:cover;display:block}
.th span{position:absolute;left:4px;bottom:4px;background:#ffe14d;color:#1b1530;font-family:Bangers;font-size:15px;padding:0 6px;border-radius:6px}
.th.locked{border-color:#6a5a9c}.th i{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-style:normal;font-size:30px;background:rgba(10,3,34,.35)}
.th:not(.locked){box-shadow:0 0 0 3px #39ff14}
.reader{position:fixed;inset:0;background:rgba(5,2,20,.96);display:none;align-items:center;justify-content:center;z-index:60;padding:50px 60px}
.rstage{position:relative;height:100%;display:flex;align-items:center;justify-content:center}
.rstage img{max-height:88vh;max-width:100%;border-radius:6px;box-shadow:0 20px 60px #000}.rstage img.blur{filter:blur(2px) brightness(.6)}
.rlock{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;gap:14px;padding:20px}
.rnav{background:#ffe14d;border:3px solid #1b1530;border-radius:50%;width:54px;height:54px;font-size:34px;line-height:1;cursor:pointer;position:absolute;top:50%;transform:translateY(-50%)}
.rnav.prev{left:10px}.rnav.next{right:10px}
.rclose{position:absolute;top:10px;right:14px;background:#fff;border:none;border-radius:50%;width:40px;height:40px;font-size:20px;cursor:pointer}
.rcount{position:absolute;bottom:12px;left:0;right:0;text-align:center;color:#fff;font-weight:600}
@media (max-width:820px){.reader{padding:50px 8px}.rnav{width:44px;height:44px;font-size:28px}.rnav.prev{left:4px}.rnav.next{right:4px}}