.hb-reader,.hb-reader *,.hb-reader *::before,.hb-reader *::after{box-sizing:border-box}
.hb-reader{--ink:#ece3cf;--body:#d8ccb2;--sec:#b6a780;--muted:#8a7d5e;--gold:#d4af37;--gold-lt:#f2dd8c;
  --rule:rgba(212,175,55,.42);--rule-soft:rgba(212,175,55,.16);--head:#e6c86a;
  --quote:#c9b98a;--panel:rgba(0,0,0,.28);--panel-bd:rgba(212,175,55,.30);
  --even:rgba(212,175,55,.06);--badge-bg:#c99a2e;--badge-tx:#211803;--img-bd:rgba(212,175,55,.4);
  position:relative;width:100%;max-width:1000px;margin-left:auto;margin-right:auto;
  font-family:'Crimson Text',Georgia,serif;
  background:linear-gradient(150deg,#22262f 0%,#1e2128 45%,#191c22 100%);padding:54px 60px 46px;
  box-shadow:0 0 0 1px rgba(0,0,0,.6),inset 0 0 0 2px rgba(212,175,55,.5),
    inset 0 0 0 5px rgba(13,13,13,.6),inset 0 0 90px rgba(0,0,0,.35),0 30px 80px rgba(0,0,0,.6);
  color:var(--body)}
.hb-reader::before{content:"";position:absolute;inset:9px;border:1px solid rgba(212,175,55,.20);pointer-events:none}
.hb-reader .corner{position:absolute;width:34px;height:34px;pointer-events:none;z-index:3}
.hb-reader .corner::before,.hb-reader .corner::after{content:"";position:absolute;background:linear-gradient(135deg,#f2dd8c,#a9822b)}
.hb-reader .corner::before{width:100%;height:3px}.hb-reader .corner::after{width:3px;height:100%}
.hb-reader .corner.tl{top:14px;left:14px}.hb-reader .corner.tr{top:14px;right:14px}.hb-reader .corner.tr::after{right:0}
.hb-reader .corner.bl{bottom:14px;left:14px}.hb-reader .corner.bl::before{bottom:0}
.hb-reader .corner.br{bottom:14px;right:14px}.hb-reader .corner.br::before{bottom:0}.hb-reader .corner.br::after{right:0}

.hb-reader .kicker{text-align:center;font-family:'Cinzel',serif;font-size:11.5px;letter-spacing:.28em;
  color:var(--muted);text-transform:uppercase;margin-bottom:14px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.hb-reader .kicker .tag{background:#7a2718;color:#f0d9b0;padding:3px 9px;border-radius:2px;letter-spacing:.14em;
  box-shadow:inset 0 0 0 1px rgba(240,217,176,.25)}
.hb-reader .title{text-align:center;font-family:'Cinzel Decorative',serif;font-weight:700;font-size:clamp(24px,6.2vw,58px);line-height:1.04;
  letter-spacing:.02em;margin:0;overflow-wrap:break-word;word-break:break-word;hyphens:auto;-webkit-hyphens:auto;
  background:linear-gradient(180deg,#f7e9b6 0%,#e0be5c 42%,#b98d2f 72%,#e8cd78 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:#d4af37;
  filter:drop-shadow(0 2px 0 rgba(0,0,0,.55)) drop-shadow(0 0 18px rgba(212,175,55,.12))}
.hb-reader .byline{text-align:center;font-family:'Cinzel',serif;font-size:12px;letter-spacing:.12em;color:var(--muted);margin-top:8px}

.hb-reader .orn{display:flex;align-items:center;justify-content:center;gap:16px;margin:22px 0 30px}
.hb-reader .orn .l{height:1px;flex:1;max-width:230px}
.hb-reader .orn .l.a{background:linear-gradient(90deg,transparent,var(--rule))}
.hb-reader .orn .l.b{background:linear-gradient(90deg,var(--rule),transparent)}
.hb-reader .orn svg{width:74px;height:16px;flex:none;color:var(--gold)}

.hb-reader .cols{display:grid;grid-template-columns:1fr 358px;gap:44px;align-items:start}
.hb-reader .lead{font-size:18px;line-height:1.62;color:var(--body);margin:0 0 14px;text-align:justify}
.hb-reader .lead::first-letter{float:left;font-family:'Cinzel Decorative',serif;font-weight:700;font-size:4.6rem;
  line-height:.72;padding:6px 12px 0 0;color:var(--gold);text-shadow:0 2px 0 rgba(0,0,0,.5)}
.hb-reader .prose p{font-size:16.5px;line-height:1.6;color:var(--body);margin:0 0 12px;text-align:justify}
.hb-reader .shead{font-family:'Cinzel',serif;font-weight:600;font-size:15px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--head);margin:26px 0 12px;display:flex;align-items:center;gap:12px;white-space:nowrap}
.hb-reader .shead::after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--rule),transparent)}
.hb-reader .abil{margin:0 0 12px}.hb-reader .abil .an{font-family:'Cinzel',serif;font-weight:600;color:var(--head);font-size:15px}
.hb-reader .abil p{margin:3px 0 0;font-size:16px;line-height:1.55}
.hb-reader .wlist{list-style:none;padding:0;margin:0}
.hb-reader .wlist li{font-size:16px;line-height:1.5;padding:6px 0;border-bottom:1px dotted var(--rule-soft)}
.hb-reader .wlist li:last-child{border-bottom:0}

.hb-reader .art{width:100%;border:1px solid var(--img-bd);padding:5px;background:rgba(0,0,0,.25);margin-bottom:22px}
.hb-reader .art img{display:block;width:100%;height:auto}
.hb-reader .stat{position:relative;background:var(--panel);border:1px solid var(--panel-bd);padding:22px 20px 16px;margin-bottom:24px}
.hb-reader .badge{position:absolute;top:-13px;left:50%;transform:translateX(-50%);font-family:'Cinzel',serif;font-weight:700;
  font-size:11px;letter-spacing:.16em;background:var(--badge-bg);color:var(--badge-tx);padding:5px 22px;white-space:nowrap;
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 50%,calc(100% - 10px) 100%,10px 100%,0 50%);box-shadow:0 2px 6px rgba(0,0,0,.4)}
.hb-reader .srow{display:grid;grid-template-columns:auto auto;gap:9px 18px;font-size:15px;margin-top:6px}
.hb-reader .srow .k{color:var(--muted)}.hb-reader .srow .v{color:var(--ink);font-weight:600;text-align:right}
.hb-reader .sfull{border-top:1px solid var(--rule-soft);margin-top:12px;padding-top:11px;font-size:15px}
.hb-reader .sfull .k{color:var(--muted)}.hb-reader .sfull .v{color:var(--ink);font-weight:600}
.hb-reader .attr{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-top:12px;border-top:1px solid var(--rule-soft);padding-top:12px}
.hb-reader .attr div{text-align:center;background:rgba(212,175,55,.05);border:1px solid var(--rule-soft);padding:5px 0}
.hb-reader .attr .al{font-size:10px;color:var(--muted);letter-spacing:.04em}.hb-reader .attr .av{font-family:'Cinzel',serif;font-size:16px;color:var(--ink)}

.hb-reader .ribbon{position:relative;text-align:center;font-family:'Cinzel',serif;font-weight:700;font-size:12.5px;letter-spacing:.18em;
  color:var(--badge-tx);background:var(--badge-bg);padding:8px 0;margin:0 -4px 8px;
  clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 50%,calc(100% - 14px) 100%,14px 100%,0 50%);box-shadow:0 3px 8px rgba(0,0,0,.35)}
.hb-reader .atkhd{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.16em;color:var(--muted);padding:8px 12px 4px;text-transform:uppercase}
.hb-reader .atk{display:flex;gap:12px;padding:9px 12px;font-size:14.5px;line-height:1.45;color:var(--body)}
.hb-reader .atk:nth-child(even){background:var(--even)}
.hb-reader .atk .n{font-family:'Cinzel Decorative',serif;font-weight:700;font-size:16px;color:var(--gold);min-width:26px;text-align:center;line-height:1.2}
.hb-reader .atk b{color:var(--head);font-weight:600}.hb-reader .atk .dmg{color:var(--gold);font-weight:600;white-space:nowrap}

.hb-reader .footer{margin-top:30px}
.hb-reader .footer .lbl{text-align:center;font-family:'Cinzel',serif;font-size:10px;letter-spacing:.34em;color:var(--muted);text-transform:uppercase;margin-top:4px}
.hb-reader .loading{text-align:center;color:var(--muted);font-family:'Cinzel',serif;padding:40px;letter-spacing:.1em}

.hb-reader.light{--ink:#1c1a16;--body:#3a3328;--sec:#5a5040;--muted:#8a7a6a;--gold:#9a6f00;--gold-lt:#c99100;
  --rule:rgba(154,111,0,.42);--rule-soft:rgba(154,111,0,.16);--head:#973c32;--quote:#5a5040;
  --panel:rgba(154,111,0,.07);--panel-bd:rgba(154,111,0,.28);--even:rgba(154,111,0,.07);
  --badge-bg:#c99100;--badge-tx:#2c2110;--img-bd:rgba(154,111,0,.4);
  background:linear-gradient(155deg,#f6f0e4 0%,#efe7d6 55%,#e7ddc9 100%);
  box-shadow:inset 0 0 0 1px rgba(154,111,0,.35),inset 0 0 60px rgba(120,90,30,.10),0 30px 80px rgba(0,0,0,.55);color:var(--body)}
.hb-reader.light::before{border-color:rgba(154,111,0,.22)}
.hb-reader.light .corner::before,.hb-reader.light .corner::after{background:linear-gradient(135deg,#c99100,#7a5a00)}
.hb-reader.light .title{background:none;-webkit-text-fill-color:initial;color:#1c1a16;filter:drop-shadow(0 1px 0 rgba(255,255,255,.4))}
.hb-reader.light .lead::first-letter{color:#8a6200;text-shadow:0 1px 0 rgba(255,255,255,.5)}

.hb-reader-toolbar{max-width:1000px;margin:0 auto 16px;display:flex;gap:10px;align-items:center;justify-content:flex-end}
.hb-reader-toolbar button{font-family:'Cinzel',serif;font-size:12px;letter-spacing:.04em;background:rgba(212,175,55,.06);border:1px solid rgba(212,175,55,.35);color:#d4af37;border-radius:3px;padding:8px 14px;cursor:pointer}
.hb-reader-toolbar button:hover{background:rgba(212,175,55,.14)}
.hb-reader-toolbar .back{margin-right:auto;background:none;border:none;box-shadow:none;padding-left:0;color:#a0a8b8;letter-spacing:.06em}
.hb-reader-toolbar .back:hover{background:none;color:#d4af37}
.hb-reader-wrap{padding:34px 20px 80px}

@media(max-width:820px){
  .hb-reader-wrap{padding:20px 12px 60px}
  .hb-reader .cols{grid-template-columns:1fr;gap:24px}
  .hb-reader{padding:40px 24px 32px}
  .hb-reader .title{letter-spacing:0}
}
@media(max-width:560px){
  .hb-reader-wrap{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);padding:12px 8px 48px}
  .hb-reader{padding:28px 14px 22px}
  .hb-reader::before{inset:6px}
  .hb-reader .corner{width:22px;height:22px}
  .hb-reader .kicker{font-size:10px;letter-spacing:.16em}
  .hb-reader .lead,.hb-reader .prose p{text-align:left;hyphens:auto;-webkit-hyphens:auto}
  .hb-reader .lead{font-size:17px}
  .hb-reader .lead::first-letter{font-size:3.6rem}
  .hb-reader .orn .l{max-width:90px}
  .hb-reader-toolbar{flex-wrap:wrap;gap:6px}
  .hb-reader-toolbar button{padding:7px 10px}
}

@media print{
  .unified-header,.app-nav,.app-footer,.hb-reader-toolbar,.mobile-nav,.cookie-consent{display:none !important}
  body,body.app-active{background:#fff !important}
  .hb-reader-wrap{padding:0 !important}
  .hb-reader{box-shadow:none !important;max-width:100% !important;padding:24px 28px !important}
  .hb-reader .cols{grid-template-columns:1fr !important}
  .hb-reader .stat,.hb-reader .atk,.hb-reader .abil{break-inside:avoid}
  .hb-reader .corner{display:none}
}
.hb-reader .secret{background:rgba(122,39,24,.10);border:1px solid rgba(212,175,55,.25);border-left:3px solid #7a2718;border-radius:0 3px 3px 0;padding:12px 14px;margin-bottom:12px}
.hb-reader .secret p{margin:0 0 6px}.hb-reader .secret p:last-child{margin:0}
.hb-reader.light .secret{background:rgba(151,60,50,.08)}
.hb-reader .prose.single{max-width:720px;margin:0 auto}
.hb-reader .hb-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px}
.hb-reader .hb-gallery img{width:100%;height:auto;border:1px solid var(--img-bd);padding:4px;background:rgba(0,0,0,.2);cursor:zoom-in;transition:border-color .15s}
.hb-reader .hb-gallery img:hover{border-color:var(--gold)}

.hb-related{max-width:1000px;margin:0 auto;padding:28px 0 0}
.hb-related-head{font-family:'Cinzel',serif;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#d4af37;text-align:center;margin:0 0 18px}
.hb-related-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px}
.hb-related-card{display:flex;flex-direction:column;gap:8px;text-decoration:none;background:#1e2128;border:1px solid rgba(212,175,55,.2);border-radius:3px;padding:10px;transition:border-color .15s,transform .15s}
.hb-related-card:hover{border-color:#d4af37;transform:translateY(-2px)}
.hb-related-thumb{display:block;width:100%;aspect-ratio:4/3;background-color:#0e0c14;background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:2px}
.hb-related-thumb.is-empty{background-image:linear-gradient(135deg,#22262f,#161519)}
.hb-related-name{font-family:'Cinzel',serif;font-size:13px;color:#f0d875;text-align:center;line-height:1.3}
@media print{.hb-related{display:none}}
@media(max-width:560px){.hb-related-grid{grid-template-columns:1fr 1fr;gap:10px}}
.hb-reader .pull{font-family:'Crimson Text',serif;font-style:italic;font-size:18px;line-height:1.5;color:var(--quote);border-left:2px solid var(--rule);padding:2px 0 2px 20px;margin:0 0 6px}
.hb-reader .pull-by{font-family:'Cinzel',serif;font-size:11px;letter-spacing:.1em;color:var(--gold);text-transform:uppercase;padding-left:22px;margin:0 0 22px}
