*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,Helvetica,sans-serif;background:radial-gradient(circle at center,#183e3f 0%,#071414 45%,#020505 100%);color:white;min-height:100vh}.home{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:40px;overflow:hidden}.home h1{font-size:clamp(30px,5vw,55px);letter-spacing:6px;margin-bottom:15px;color:#fff}.subtitle{font-size:13px;letter-spacing:4px;color:#aaa;margin-bottom:60px}.packs{display:flex;justify-content:center;align-items:center;gap:80px}.pack{position:relative;width:280px;cursor:pointer;transition:transform .3s ease,filter .3s ease}.pack img{width:100%;display:block}.pack:hover{transform:translateY(-12px) scale(1.04)}.silver-pack:hover{filter:drop-shadow(0 0 35px rgba(220,220,220,.7))}.gold-pack:hover{filter:drop-shadow(0 0 45px rgba(255,215,0,.8))}.pack-info{position:absolute;left:0;right:0;bottom:20px;text-align:center;pointer-events:none;z-index:5}.pack-info h2{font-size:32px;letter-spacing:6px;color:#fff;font-weight:800;margin-bottom:7px;text-shadow:0 2px 5px #000,0 0 12px rgba(255,255,255,.8)}.pack-info p{font-size:13px;letter-spacing:3px;color:#fff;font-weight:700;text-shadow:0 2px 5px #000,0 0 10px rgba(255,255,255,.6)}.instruction{margin-top:55px;font-size:11px;letter-spacing:3px;color:#aaa;animation:pulse 2s infinite}@keyframes pulse{0%,100%{opacity:.5}50%{opacity:1}}.opening-pack{pointer-events:none}.home.opening .opening-pack{animation:packOpening 1.2s ease forwards}@keyframes packOpening{0%{transform:scale(1) rotate(0deg);opacity:1;filter:drop-shadow(0 0 0 transparent)}25%{transform:scale(1.1) rotate(-3deg)}50%{transform:scale(1.3) rotate(3deg);filter:drop-shadow(0 0 80px gold)}75%{transform:scale(1.6) rotate(-2deg);filter:drop-shadow(0 0 120px gold)}100%{transform:scale(2) rotate(0deg);opacity:0}}.card-screen{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(circle at center,#183e3f 0%,#071414 45%,#020505 100%);animation:cardScreenAppear .8s ease}.card-title{margin-bottom:25px;font-size:16px;letter-spacing:6px;color:#ffd700;animation:titleAppear 1s ease}.revealed-card{width:390px;max-width:80vw;cursor:pointer;opacity:0;transform:scale(.4) rotateY(90deg);filter:drop-shadow(0 0 20px rgba(255,215,0,.3));animation:cardReveal 1.2s .2s ease forwards;transition:transform .5s ease,filter .5s ease}.revealed-card:hover{transform:scale(1.05) rotateY(5deg);filter:drop-shadow(0 0 70px rgba(255,215,0,.9))}.card-instruction{margin-top:25px;font-size:12px;letter-spacing:3px;color:#bdbdbd;animation:pulse 2s infinite}@keyframes cardScreenAppear{from{opacity:0}to{opacity:1}}@keyframes titleAppear{from{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes cardReveal{0%{opacity:0;transform:scale(.4) rotateY(90deg)}60%{opacity:1;transform:scale(1.05) rotateY(-10deg)}100%{opacity:1;transform:scale(1) rotateY(0deg)}}@media(max-width:700px){.packs{flex-direction:column;gap:40px}.pack{width:230px}.subtitle{margin-bottom:35px}.home{padding:25px}.pack-info{bottom:20px}}.back-button{position:absolute;top:30px;left:30px;padding:12px 22px;background:rgba(255,255,255,.08);border:1px solid rgba(255,215,0,.5);color:#ffd700;font-size:12px;letter-spacing:2px;cursor:pointer;transition:.3s}.back-button:hover{background:#ffd700;color:#050505;box-shadow:0 0 25px rgba(255,215,0,.6)}