/* Styles for the static guide pages (/classes/, /bosses/ ...). Matches the game's look. */
@font-face{font-family:'Jersey 15';src:url('/fonts/jersey-15.woff2') format('woff2');font-display:swap;size-adjust:125%}
@font-face{font-family:'Jersey 15';src:url('/fonts/jersey-15-ext.woff2') format('woff2');font-display:swap;size-adjust:125%;unicode-range:U+0100-02BA,U+1E00-1E9F}
@font-face{font-family:'EB Garamond';src:url('/fonts/eb-garamond.woff2') format('woff2');font-display:swap}
@font-face{font-family:'EB Garamond';src:url('/fonts/eb-garamond-ext.woff2') format('woff2');font-display:swap;unicode-range:U+0100-02BA,U+1E00-1E9F}
*{box-sizing:border-box}
html,body{margin:0;background:#0d0a07;color:#e8dcc0;font:19px/1.5 'EB Garamond',Georgia,serif}
a{color:#e8c46a}
img{image-rendering:pixelated;max-width:100%}
.px{font-family:'Jersey 15',monospace;letter-spacing:.12em;text-transform:uppercase}
header.top{border-bottom:1px solid #4a3d2a;background:#14100c}
.wrap{max-width:1080px;margin:0 auto;padding:0 16px}
.top .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;padding-top:10px;padding-bottom:10px}
.logo img{height:34px;display:block}
nav.guide{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:15px}
nav.guide a{text-decoration:none;color:#c9b88f}
nav.guide a[aria-current]{color:#f4d27a}
.play{display:inline-block;padding:11px 26px;color:#fff;text-decoration:none;font-size:15px;border:2px solid #ffd76a;background:linear-gradient(#e0892e,#b8561a);box-shadow:0 3px 10px rgba(0,0,0,.6)}
.play:hover{filter:brightness(1.12)}
.hero{position:relative;overflow:hidden;border-bottom:1px solid #4a3d2a}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.45}
.hero .wrap{position:relative;padding:56px 16px 44px}
h1{font-family:'Jersey 15',monospace;font-weight:400;font-size:40px;line-height:1.1;letter-spacing:.06em;color:#f4d27a;margin:0 0 12px;text-shadow:2px 2px 0 #000}
h2{font-family:'Jersey 15',monospace;font-weight:400;font-size:26px;letter-spacing:.1em;text-transform:uppercase;color:#e8c46a;margin:36px 0 12px}
h3{font-family:'Jersey 15',monospace;font-weight:400;font-size:21px;letter-spacing:.08em;color:#f4d27a;margin:0 0 4px}
.lead{font-size:22px;max-width:760px;margin:0 0 20px;text-shadow:0 1px 2px #000}
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.card{border:1px solid #4a3d2a;background:#14100c;padding:16px}
.card .art{display:flex;align-items:flex-end;justify-content:center;height:220px;margin-bottom:10px;background:radial-gradient(circle at 50% 70%,rgba(212,169,74,.16),transparent 65%)}
.card .art img{max-height:220px;width:auto}
.tag{display:inline-block;font-size:14px;color:#a9b2bf}
table{width:100%;border-collapse:collapse;font-size:17px}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid #2c241a;vertical-align:middle}
th{font-family:'Jersey 15',monospace;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:#c9b88f;font-size:15px}
td img{width:36px;height:36px;object-fit:contain;vertical-align:middle}
.r-common{color:#d9d4c6}.r-uncommon{color:#7fd48a}.r-rare{color:#6fb7e8}.r-epic{color:#c48bf2}.r-legendary{color:#f2a541}
.cta{border:1px solid #4a3d2a;background:#14100c;padding:28px 16px;text-align:center;margin:40px 0}
footer.bottom{border-top:1px solid #4a3d2a;padding:20px 0;font-size:15px;color:#a9b2bf;text-align:center}
footer.bottom a{color:#c9b88f;margin:0 6px}
.scroll{overflow-x:auto}
@media (max-width:600px){h1{font-size:30px}.lead{font-size:19px}h2{font-size:22px}}