.pack-page [hidden]{display:none!important}

.pack-main{padding-block:80px 30px}.pack-intro{max-width:820px;margin-bottom:64px}
.pack-eyebrow{font-size:11px;font-weight:800;letter-spacing:.16em;margin-bottom:18px}
.pack-intro h1{font-size:clamp(48px,6vw,80px);line-height:1.03;margin-bottom:26px}
.pack-intro h1 span{color:var(--yellow);-webkit-text-stroke:.11em #1b72bb;paint-order:stroke fill;text-shadow:.045em .065em #153e7e}
.pack-intro>p:not(.pack-eyebrow){max-width:620px;font-size:18px;color:var(--muted)}
.pack-disclosure{font-size:13px;line-height:1.7;background:#f1f0df;border-left:3px solid var(--yellow);padding:18px 22px;margin-top:28px}
.pack-library-heading{display:flex;flex-direction:column;align-items:stretch;gap:18px;margin-bottom:18px}.pack-library-heading h2{font-size:clamp(30px,4vw,44px)}
.pack-page button{cursor:pointer;background:var(--paper);border:1px solid #a4b0be;border-radius:9px;min-height:44px;padding:10px 16px;font-size:13px;font-weight:700}
.pack-page button:hover{background:#fff0b3}.pack-page button:disabled{opacity:.65;cursor:wait}
.pack-status{font-size:13px;color:var(--muted);margin-bottom:22px}.pack-status a{text-decoration:underline}
.pack-accordion{border:1px solid #bac1c5;border-radius:18px;margin-bottom:18px;overflow:hidden;background:var(--paper);box-shadow:0 4px 0 #15345f0b}
.pack-accordion>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:22px;padding:26px}.pack-accordion>summary::-webkit-details-marker{display:none}
.pack-glyph{width:62px;height:78px;display:grid;place-items:center;flex:none;background:linear-gradient(135deg,#fff29a,var(--yellow));border:2px solid var(--blue);border-radius:9px 9px 15px 15px;box-shadow:3px 4px 0 var(--navy);transform:rotate(-5deg)}
.pack-glyph img{width:36px;height:43px;object-fit:contain}.pack-summary-main{flex:1;min-width:0}.pack-summary-main h3{font-size:21px;letter-spacing:-.03em;line-height:1.25}.pack-summary-main p{font-size:12px;color:var(--muted);margin-top:8px}
.pack-price{font-size:24px;font-weight:800;white-space:nowrap}.pack-chevron{font-size:25px;margin-left:10px}.pack-accordion[open] .pack-chevron{transform:rotate(45deg)}
.pack-body{border-top:1px solid var(--line);padding:24px}.pack-body-intro{display:flex;justify-content:space-between;gap:18px;font-size:12px;margin-bottom:22px;color:var(--muted)}.pack-body-intro a{text-decoration:underline}
.pack-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.pack-filters button{flex:1;min-width:120px;display:flex;flex-direction:column;gap:4px;align-items:center}
.pack-filters small{font-size:10px;font-weight:500}.inventory-status{font-size:12px;color:var(--muted);margin-block:14px;line-height:1.6}
.inventory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.inventory-card{min-width:0;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--cream)}
.inventory-image{height:235px;display:grid;grid-template-rows:minmax(0,1fr);place-items:center;background:var(--rarity-tint,#e7eada);padding:18px;position:relative;overflow:hidden}.inventory-image img{height:100%;width:100%;min-height:0;min-width:0;object-fit:contain;filter:drop-shadow(0 9px 7px #15345f21)}
.inventory-copy{padding:16px}.inventory-copy h3{font-size:14px;line-height:1.5;letter-spacing:0;font-weight:700;overflow-wrap:anywhere}.inventory-tier{font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;margin-bottom:8px}.inventory-value{font-size:24px;font-weight:800;margin-top:12px}.inventory-value-note{font-size:10px;color:var(--muted);margin-bottom:14px}
.inventory-copy details{font-size:12px;border-top:1px solid var(--line);padding-top:12px}.inventory-copy summary{cursor:pointer;min-height:30px;font-weight:700}.inventory-copy dl{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.inventory-copy dt{color:var(--muted)}.inventory-copy dd{margin:0;overflow-wrap:anywhere}.inventory-copy a{display:block;text-decoration:underline;line-height:1.6;margin-top:12px}.inventory-copy details img{max-height:240px;object-fit:contain;margin:15px auto}
.inventory-more{display:block;margin:24px auto 0}.pack-explainer{margin-block:70px 40px;max-width:780px}.pack-explainer h2{font-size:36px;margin-bottom:20px}.pack-explainer p{color:var(--muted);font-size:14px}.pack-explainer a{display:inline-block;margin-top:18px;text-decoration:underline;font-size:13px;font-weight:700}

@media(max-width:800px){.pack-main{padding-top:45px}.pack-library-heading{align-items:flex-start;flex-direction:column;gap:10px}.inventory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.pack-accordion>summary{padding:20px;gap:16px}.pack-price{font-size:20px}.pack-summary-main h3{font-size:18px}.pack-body-intro{flex-direction:column;gap:6px}}
@media(max-width:480px){.pack-page .shell{width:calc(100% - 32px)}.pack-intro h1{font-size:47px}.pack-intro>p:not(.pack-eyebrow){font-size:16px}.pack-glyph{width:38px;height:50px}.pack-glyph img{width:26px;height:32px}.pack-accordion>summary{flex-wrap:wrap;gap:13px;padding:18px}.pack-summary-main{flex-basis:calc(100% - 60px)}.pack-price{margin-left:51px}.pack-chevron{margin-left:auto}.pack-body{padding:16px}.inventory-grid{grid-template-columns:1fr}.inventory-image{height:275px}.pack-filters button{min-width:95px}.pack-disclosure{padding:15px}}

#refresh-packs{display:inline-flex;align-items:center;justify-content:center;gap:10px;align-self:center}.refresh-icon{flex:none}

.pack-glyph.pack-cover{background:transparent;border:0;box-shadow:none;transform:none;border-radius:0}.pack-glyph.pack-cover img{width:100%;height:100%;object-fit:contain}

.inventory-buyback{font-size:13px;font-weight:700;line-height:1.5;margin:12px 0 3px;color:var(--navy)}
.pack-summary-main .pack-buyback-rate{font-size:12px;font-weight:700;color:var(--navy);margin-top:7px}

.pack-page [data-rarity="common"]{--rarity-tint:#e7eada;--rarity-accent:#596341}
.pack-page [data-rarity="uncommon"]{--rarity-tint:#dce8dc;--rarity-accent:#3f6846}
.pack-page [data-rarity="rare"]{--rarity-tint:#dce7f3;--rarity-accent:#285e97}
.pack-page [data-rarity="epic"]{--rarity-tint:#f3e8ff;--rarity-accent:#7c3aed}
.pack-filters button[data-rarity]{background:var(--rarity-tint);border-color:var(--rarity-accent);color:var(--navy)}
.pack-filters button[data-rarity][aria-pressed="true"]{box-shadow:inset 0 0 0 2px var(--rarity-accent);font-weight:800}

/* Same fixed background as the landing page; the catalogue status line stays for the script but is not shown. */
body.pack-page{background:transparent;isolation:isolate}
.public-background{position:fixed;inset:0;z-index:-1;pointer-events:none;background:#f5d65b url("/comic-production/hookemon-background-yellow-2560.webp") center / cover no-repeat}
@media (max-width:1600px){.public-background{background-image:url("/comic-production/hookemon-background-yellow-1600.webp")}}
@media (max-width:860px){.public-background{background-image:url("/comic-production/hookemon-background-yellow-960.webp");background-position:50% 40%}}
.pack-page #catalog-status{display:none}

/* Every card in a row shares the same baseline: names reserve two lines, so price, buyback and rule line up. */
.inventory-card{display:flex;flex-direction:column}
.inventory-copy{display:flex;flex-direction:column;flex:1}
.inventory-copy h3{min-height:calc(2 * 1.5em);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.inventory-copy details{margin-top:auto}

/* Phone header like the landing page: logo, then links in one wrapping row, actions on the right. */

.refresh-icon{width:18px;height:18px;flex:none}
.pack-page .info-nav{flex-wrap:nowrap}

/* Intro copy sits on the same translucent panels as the landing page, so it stays readable on the ball. */
.pack-intro,.pack-library-heading{background:rgb(255 253 246 / 96%);border:1px solid rgb(21 52 95 / 40%);border-radius:16px;padding:16px 20px;width:fit-content;max-width:100%;box-sizing:border-box}
.pack-intro{margin-bottom:28px}.pack-intro h1{margin-bottom:0}.pack-library-heading{margin-bottom:22px}
.pack-library-heading{width:100%}