:root { --green:#25f33d; --mint:#d8f0e8; --ink:#153d2c; --paper:#f3fff0; --purple:#5d2188; }
    * { box-sizing:border-box; }
    body { margin:0; background:var(--mint); color:var(--ink); font-family:Georgia,'Times New Roman',serif; }
    button { cursor:pointer; font:inherit; }
    header { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:15px 26px; background:var(--green); border-bottom:3px solid var(--ink); font:700 11px Arial,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
    header strong { font:900 28px 'Arial Black',Arial,sans-serif; letter-spacing:-.07em; }
    main { min-height:calc(100vh - 62px); display:grid; grid-template-columns:250px minmax(350px,1fr) 270px; }
    aside { padding:27px; border-right:1px solid #83aa96; }
    aside.right { border-right:0; border-left:1px solid #83aa96; }
    .eyebrow { font:800 11px Arial,sans-serif; letter-spacing:.17em; text-transform:uppercase; color:var(--purple); }
    h1 { font-size:clamp(42px,4.2vw,67px); font-weight:400; line-height:.96; letter-spacing:-.055em; margin:7px 0 13px; }
    p { line-height:1.42; }
    .shelf { display:grid; gap:7px; margin:22px 0; }
    .shelf button,.collection button { border:1px solid #79a08d; background:var(--paper); color:var(--ink); padding:10px 12px; text-align:left; font:700 12px Arial,sans-serif; }
    .shelf button { display:flex; align-items:center; gap:8px; text-transform:uppercase; letter-spacing:.05em; }
    .shelf button span { font-size:19px; width:25px; }
    .shelf button.active { background:var(--ink); color:var(--paper); }
    .fine { font:11px Arial,sans-serif; color:#4e6b59; }
    .display { padding:26px 28px 34px; display:flex; flex-direction:column; align-items:center; text-align:center; }
    .display p { max-width:580px; margin:0 0 14px; }
    .pack { position:relative; width:min(100%,565px); aspect-ratio:1; margin:11px auto 23px; border:5px solid var(--ink); box-shadow:13px 13px 0 #4f87646d; overflow:hidden; background:var(--mint); }
    .pack::after { content:'FEVERLOOT  /  ISSUE 001'; position:absolute; right:13px; bottom:13px; background:var(--paper); border:1px solid var(--ink); padding:6px 9px; font:800 11px Arial,sans-serif; letter-spacing:.08em; }
    .art { width:100%; height:100%; background-image:url('../assets/issue-001-contact-sheet.png'); background-size:300% 300%; background-repeat:no-repeat; transition:filter .3s,transform .3s; }
    .art[data-item="0"] { background-position:0% 0%; }
    .art[data-item="1"] { background-position:50% 0%; }
    .art[data-item="2"] { background-position:100% 0%; }
    .art[data-item="3"] { background-position:0% 50%; }
    .art[data-item="4"] { background-position:50% 50%; }
    .art[data-item="5"] { background-position:100% 50%; }
    .art[data-item="6"] { background-position:0% 100%; }
    .art[data-item="7"] { background-position:50% 100%; }
    .art[data-item="8"] { background-position:100% 100%; }
    .sealed .art { filter:blur(22px) saturate(.65); transform:scale(1.08); }
    .actions { display:flex; flex-wrap:wrap; justify-content:center; gap:9px; }
    .actions button,.combine button { border:2px solid var(--ink); background:var(--ink); color:var(--paper); padding:11px 15px; font:800 11px Arial,sans-serif; letter-spacing:.08em; text-transform:uppercase; }
    .actions button.secondary { background:transparent; color:var(--ink); }
    button:disabled { opacity:.46; cursor:not-allowed; }
    .count { font:400 42px Georgia,serif; margin:8px 0; }
    .collection { display:grid; gap:6px; margin:18px 0; }
    .collection button.selected { outline:3px solid var(--purple); }
    .combine { border-top:1px solid #83aa96; padding-top:18px; font-size:13px; }
    .combine p { min-height:60px; }
    @media(max-width:990px) { main { grid-template-columns:1fr; } aside,aside.right { border:0; border-bottom:1px solid #83aa96; } .shelf { grid-template-columns:repeat(3,1fr); } .shelf button { font-size:10px; } }
    @media(max-width:570px) { header { padding:13px; } header span { display:none; } aside,.display { padding:18px; } .shelf { grid-template-columns:repeat(2,1fr); } .pack { box-shadow:7px 7px 0 #4f87646d; } }