.guide-page { max-width: 1180px; }
.guide-hero { border-top: 5px solid var(--ink); border-bottom: 5px double var(--ink); padding-bottom: 22px; }
.guide-edition { display:flex; justify-content:space-between; gap:16px; padding:10px 0; border-bottom:1px solid var(--ink); font-size:13px; text-transform:uppercase; letter-spacing:.09em; }
.guide-headline { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-top:30px; }
.guide-headline h1 { font-family:var(--font-display); font-size:clamp(66px,11vw,132px); line-height:.91; letter-spacing:-.065em; margin:16px 0 26px; }
.guide-headline h1 em { font-family:var(--font-hand); font-weight:400; color:var(--red-ink); }
.guide-seal { flex-shrink:0; width:150px; height:150px; border:2px solid var(--red-ink); outline:1px solid var(--red-ink); outline-offset:6px; border-radius:50%; display:grid; place-content:center; text-align:center; color:var(--red-ink); font-size:48px; transform:rotate(12deg); animation:seal-pop .8s cubic-bezier(.2,.8,.2,1.2) both; }
.guide-seal small { font-size:13px; line-height:1.3; letter-spacing:.12em; }
.guide-lede { max-width:660px; font-size:clamp(20px,2.5vw,28px); line-height:1.4; }
.guide-stats { display:flex; flex-wrap:wrap; align-items:center; gap:18px 32px; margin-top:24px; }
.guide-stats b { font-size:30px; font-family:var(--font-display); margin-right:5px; }
.guide-stats a { margin-left:auto; color:var(--red-ink); }
.guide-toolbar { padding:30px 0 10px; display:grid; grid-template-columns:1fr minmax(220px,400px); align-items:center; gap:8px 20px; }
.guide-toolbar label { font-size:23px; font-family:var(--font-hand); }
.guide-toolbar input { width:100%; background:var(--paper-2); border:1px solid var(--ink); color:var(--ink); border-radius:0; padding:12px 14px; font:inherit; }
.guide-toolbar p { margin:0; }
.guide-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; margin:20px 0 34px; align-items:start; }
.guide-card { position:relative; background:var(--paper-2); padding:23px; border:1px solid var(--ink); box-shadow:5px 5px 0 var(--ink); transition:transform .25s,box-shadow .25s; }
.guide-card:hover,.guide-card:focus-within { transform:translate(-2px,-3px); box-shadow:7px 8px 0 var(--red-ink); }
.guide-card-top { display:flex; justify-content:space-between; gap:12px; align-items:center; }
.guide-card-top .kicker { font-size:10px; text-align:right; }
.guide-icon { display:inline-block; font-size:36px; }
.guide-card h2 { font:700 30px/1.1 var(--font-display); margin:20px 0 12px; }
.guide-card h2 a { color:inherit; text-decoration:none; }
.guide-card p { font-size:17px; line-height:1.5; }
.feature-list { list-style:none; padding:0; margin:22px 0; border-top:1px solid var(--line); }
.feature-list li { border-bottom:1px solid var(--line); }
.feature-list a { display:flex; justify-content:space-between; gap:10px; padding:10px 0; color:var(--ink); font-size:16px; text-decoration:none; }
.feature-list a:hover { color:var(--red-ink); }
.guide-tips { margin:20px 0; border:1px dashed var(--red-ink); padding:12px; }
.guide-tips summary { cursor:pointer; font-weight:600; color:var(--red-ink); }
.guide-tips summary span { font-size:13px; }
.guide-tips ul { margin-bottom:0; padding-left:18px; font-size:16px; }
.guide-tips li+li { margin-top:12px; }
.guide-tips[open] ul { animation:tip-pop .35s ease-out; }
.guide-go { display:flex; justify-content:space-between; gap:12px; border-top:3px double var(--ink); padding-top:14px; color:var(--ink); font-weight:600; text-decoration:none; }
.guide-footer { display:flex; justify-content:space-between; flex-wrap:wrap; gap:16px; border-top:3px double var(--ink); padding:22px 0; font-size:15px; }
.guide-footer a { color:var(--red-ink); }
.guide-card.reveal { animation:card-pop .6s cubic-bezier(.16,1,.3,1) both; animation-delay:var(--delay,0ms); }
.guide-spark { position:absolute; pointer-events:none; color:var(--red-ink); font-size:22px; z-index:2; animation:spark-pop .65s ease-out forwards; }
@keyframes card-pop { from { opacity:0; transform:translateY(28px) rotate(1deg) scale(.97); } to { opacity:1; transform:none; } }
@keyframes tip-pop { from { opacity:0; transform:translateY(-6px); } to { opacity:1; transform:none; } }
@keyframes seal-pop { from { opacity:0; transform:rotate(-20deg) scale(.4); } to { opacity:1; transform:rotate(12deg) scale(1); } }
@keyframes spark-pop { from { opacity:1; transform:translate(0,0) scale(.5); } to { opacity:0; transform:translate(var(--sx),var(--sy)) rotate(70deg) scale(1.4); } }
@media(max-width:960px) { .guide-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) { .guide-grid { grid-template-columns:1fr; gap:22px; } .guide-toolbar { grid-template-columns:1fr; } .guide-seal { width:85px; height:85px; font-size:28px; } .guide-seal small { font-size:8px; } .guide-headline { gap:12px; } .guide-edition { font-size:10px; } .guide-stats { gap:12px 20px; } .guide-stats a { margin-left:0; width:100%; } }
@media(prefers-reduced-motion:reduce) { .guide-page *, .guide-page *::before, .guide-page *::after { animation:none !important; transition:none !important; } .guide-card:hover,.guide-card:focus-within { transform:none; } }
.upcoming-section { border-top:5px double var(--ink); padding:32px 0; }
.upcoming-heading { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.upcoming-heading h2 { font:700 clamp(44px,7vw,76px)/1 var(--font-display); letter-spacing:-.04em; margin:12px 0; }
.upcoming-heading h2 em { font-family:var(--font-hand); color:var(--red-ink); font-weight:400; }
.upcoming-heading>span { color:var(--red-ink); font-size:65px; }
.upcoming-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin:26px 0; align-items:start; }
.upcoming-card { border:1px solid var(--ink); background:var(--paper-2); box-shadow:4px 4px 0 var(--ink); }
.collection-cover { position:relative; overflow:hidden; background:var(--collection-sky); color:var(--collection-accent); padding:26px; min-height:175px; }
.collection-cover h3 { font:700 30px/1.12 var(--font-display); max-width:80%; position:relative; margin:16px 0 8px; }
.collection-cover p { font-size:14px; margin:0; position:relative; }
.collection-symbol { position:absolute; font-size:170px; right:-8px; top:-38px; opacity:.18; transform:rotate(12deg); }
.collection-tag { font-size:11px; text-transform:uppercase; letter-spacing:.12em; border:1px solid currentColor; padding:4px 8px; }
.collection-body { padding:20px; }
.collection-body>p { font-size:17px; margin:0 0 18px; }
.collection-body details { border-top:1px solid var(--line); padding:14px 0; }
.collection-body summary { cursor:pointer; font-size:18px; font-weight:600; }
.collection-body summary>span { font-size:12px; color:var(--muted); margin-left:8px; }
.prize-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; padding-top:16px; }
.prize-set { min-width:0; }
.prize-portrait { display:grid; place-items:center; height:85px; font-size:40px; color:var(--collection-accent); background:var(--collection-sky); border-bottom:3px solid var(--collection-accent); }
.prize-set h4 { font-size:15px; margin:10px 0; }
.prize-set ul { list-style:none; padding:0; margin:0; }
.prize-set li { margin-top:14px; overflow-wrap:anywhere; }
.prize-type { display:block; text-transform:uppercase; letter-spacing:.04em; font-size:9px; color:var(--muted); }
.prize-set b { display:block; font-size:13px; line-height:1.3; margin-top:4px; }
.upcoming-awards { padding-left:24px; font-size:16px; }
.upcoming-awards li { padding:8px 0; border-bottom:1px solid var(--line); }
.upcoming-awards p { color:var(--muted); font-size:14px; margin:5px 0; }
.collection-body details[open]>.prize-grid,.collection-body details[open]>.upcoming-awards { animation:tip-pop .35s ease-out; }
@media(max-width:700px) { .upcoming-grid { grid-template-columns:1fr; } .collection-cover { padding:22px; } .collection-body { padding:18px; } }
/* Collectible previews: actual lit 3D models, not generic rank emojis. */
.reward-preview { display:block; position:relative; width:100%; aspect-ratio:4/3; overflow:hidden; background:radial-gradient(ellipse at 50% 70%,var(--collection-accent),var(--collection-sky) 78%); border:1px solid var(--line); margin-bottom:10px; }
.reward-preview canvas { display:block; width:100%; height:100%; object-fit:contain; }
.reward-fallback { display:grid; place-items:center; height:100%; padding:12px; color:var(--collection-accent); background:var(--collection-sky); font:italic 13px/1.3 var(--font-hand); text-align:center; }
.reward-ready .reward-fallback { display:none; }
.reward-preview-title { aspect-ratio:4/3; }
.upcoming-awards li { display:flex; align-items:center; gap:14px; }
.upcoming-awards .reward-preview { width:95px; min-width:95px; margin:0; }
.prize-set ul { display:flex; flex-direction:column; gap:14px; }
.prize-set li { margin-top:0; }
.prize-set h4 { margin-bottom:18px; }
@media(max-width:440px) { .prize-grid { gap:7px; } .prize-set b { font-size:12px; } .prize-type { font-size:8px; } }
.release-clock { border:1px solid var(--ink); border-left:5px solid var(--red-ink); background:var(--paper-2); padding:16px 20px; }
.release-clock>span { font-size:26px; margin-right:8px; }
.release-clock small { display:block; margin-top:4px; color:var(--muted); font-size:13px; }
.collection-cover .collection-release { margin-top:8px; font-size:11px; }