:root{color:#f8f1da;background:#090d15;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0;overflow:hidden}button{font:inherit}.app-shell{width:100vw;min-height:100vh;background:linear-gradient(180deg,#0c121b00,#0c121b8f),#090d15}.stage{position:relative;width:100vw;height:100vh;min-height:100vh;overflow:hidden;isolation:isolate}.stage:before{position:absolute;inset:auto 0 0;z-index:1;height:28vh;background:linear-gradient(180deg,#090d1500,#090d15d1);content:"";pointer-events:none}.scene-canvas,.stage canvas{position:absolute;inset:0;display:block;width:100%!important;height:100%!important}.hud{position:absolute;inset:0;z-index:2;display:grid;grid-template-rows:auto 1fr auto;padding:clamp(16px,2.6vw,34px);pointer-events:none}.hud-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px}.hud-bottom{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}.hud-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}.hud-brand{color:#f8f1da;pointer-events:none}.eyebrow{display:inline-flex;margin:0 0 10px;padding:5px 8px;border:1px solid rgba(248,241,218,.28);border-radius:4px;color:#9fdfff;background:#090d156b;font-size:.68rem;font-weight:850;letter-spacing:0;text-transform:uppercase;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}h1{margin:0;color:#f8f1da;font-family:Avenir Next,Century Gothic,Futura,ui-sans-serif,system-ui,sans-serif;font-size:clamp(1.5rem,2.6vw,2.4rem);font-weight:700;line-height:1;text-transform:uppercase;letter-spacing:.14em;text-shadow:0 12px 40px rgba(0,0,0,.5)}.deckline{max-width:30ch;margin:14px 0 0;color:#e6eef4e0;font-size:clamp(.9rem,1.1vw,1.04rem);font-weight:650;line-height:1.36;text-shadow:0 12px 34px rgba(0,0,0,.4)}.account-pill{display:inline-flex;align-items:center;gap:9px;max-width:min(280px,42vw);padding:6px 6px 6px 13px;border:1px solid rgba(248,241,218,.18);border-radius:999px;background:#0c121ba8;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:auto}.account-email{overflow:hidden;color:#f8f1dae6;font-size:.78rem;font-weight:800;text-overflow:ellipsis;white-space:nowrap}.account-pill button{flex-shrink:0;border:1px solid rgba(248,241,218,.24);border-radius:999px;color:#f8f1da;background:#090d1599;cursor:pointer;font-size:.72rem;font-weight:800;padding:4px 11px}.account-pill button:hover{border-color:#ffb0a899;color:#ffb0a8}.open-pack-button{position:relative;display:inline-flex;min-width:174px;min-height:52px;align-items:center;justify-content:center;gap:9px;padding:0 16px;border:1px solid rgba(255,255,255,.44);border-radius:6px;color:#101722;background:linear-gradient(180deg,#ffffffa3,#fff0 46%),linear-gradient(135deg,#f8f1da,#ffcf61 54%,#9fdfff);box-shadow:0 14px 40px #0000005c,inset 0 1px #ffffffb8;cursor:pointer;font-size:.92rem;font-weight:900;line-height:1;pointer-events:auto}.open-pack-button:hover{transform:translateY(-1px)}.open-pack-button:active{transform:translateY(0)}.open-pack-button:focus-visible,.close-opening-button:focus-visible{outline:3px solid #9fdfff;outline-offset:3px}.open-pack-button:disabled{color:#f8f1da80;background:#f8f1da1f;cursor:not-allowed;transform:none}.open-pack-button span{white-space:nowrap}.close-opening-button{position:relative;display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(248,241,218,.28);border-radius:999px;color:#f8f1da;background:#0c121b9e;box-shadow:0 14px 34px #00000047;cursor:pointer;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:auto}.close-opening-button:hover{border-color:#ffb0a899;color:#ffb0a8}.collection-button,.open-pack-button{pointer-events:auto}.hud-status{display:grid;gap:3px;padding:11px 15px;border:1px solid rgba(248,241,218,.16);border-radius:10px;color:#f8f1da;background:#0c121b80;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none}.hud-status span,.charge-panel>span{color:#9fdfff;font-size:.66rem;font-weight:900;letter-spacing:.04em;text-transform:uppercase}.hud-status strong{font-size:1.3rem;line-height:1}.auth-panel{position:absolute;top:clamp(16px,3vw,30px);right:clamp(16px,2.6vw,34px);z-index:5;width:min(268px,calc(100vw - 32px));color:#f8f1da;pointer-events:auto}.auth-panel form{display:grid;gap:9px;padding:15px 15px 16px;border:1px solid rgba(248,241,218,.16);border-radius:13px;background:linear-gradient(180deg,#121923d1,#0a0f17db);box-shadow:0 20px 54px #0000006b;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}.auth-panel .auth-title{margin:0 0 1px;font-size:.7rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;color:#9fdfffeb}.auth-panel input{width:100%;height:38px;border:1px solid rgba(248,241,218,.2);border-radius:8px;color:#f8f1da;background:#090d15b8;font:inherit;font-size:.84rem;font-weight:600;padding:0 12px;outline:none;transition:border-color .15s ease,box-shadow .15s ease}.auth-panel input::placeholder{color:#f8f1da66;font-weight:500}.auth-panel input:focus{border-color:#9fdfff;box-shadow:0 0 0 3px #9fdfff29}.auth-panel form button[type=submit]{height:38px;margin-top:2px;border:none;border-radius:8px;color:#0a0f17;background:linear-gradient(180deg,#ffd873,#f0b53f);cursor:pointer;font-size:.82rem;font-weight:900;letter-spacing:.02em;transition:filter .15s ease,transform .05s ease}.auth-panel form button[type=submit]:hover{filter:brightness(1.06)}.auth-panel form button[type=submit]:active{transform:translateY(1px)}.auth-panel form button[type=button]{justify-self:center;border:none;background:none;color:#9fdfffd9;cursor:pointer;font-size:.74rem;font-weight:800;padding:2px 6px}.auth-panel form button[type=button]:hover{color:#cfefff;text-decoration:underline}.auth-panel .auth-error{margin:0;color:#ffb0a8;font-size:.76rem;font-weight:700}.charge-panel{position:absolute;bottom:clamp(34px,8vh,78px);left:50%;z-index:4;display:grid;width:min(420px,calc(100vw - 44px));gap:10px;padding:12px 14px;border:1px solid rgba(248,241,218,.24);border-radius:6px;background:#0c121ba8;box-shadow:0 16px 46px #00000057;transform:translate(-50%);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);pointer-events:none}.charge-meter{width:100%;height:8px;overflow:hidden;border:1px solid rgba(248,241,218,.26);border-radius:999px;background:#090d15b8}.charge-meter span{display:block;width:100%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#9fdfff,#ffcf61,#f8f1da);transform-origin:left center;transition:transform 80ms ease}@media(max-width:820px){body{overflow:auto}.stage{height:100svh;min-height:100svh}.open-pack-button{min-width:158px}.charge-panel{bottom:92px}}@media(max-width:440px){.hud-status strong{font-size:1.1rem}.account-email{max-width:34vw}}.collection-button{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 16px;border:1px solid rgba(248,241,218,.24);border-radius:999px;color:#f8f1da;background:#0c121ba8;cursor:pointer;font-size:.86rem;font-weight:800;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:border-color .15s ease,background .15s ease}.collection-button:hover{border-color:#9fdfff99;background:#121a25c7}.collection-overlay{position:absolute;inset:0;z-index:20;display:flex;flex-direction:column;padding:clamp(18px,4vw,44px);background:#06090fe6;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);overflow-y:auto}.collection-overlay.is-locked{overflow:hidden}.collection-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:clamp(16px,3vw,28px);color:#f8f1da}.collection-header h2{margin:0;font-size:clamp(1.5rem,3.4vw,2.1rem);font-weight:900;letter-spacing:.01em}.collection-header p{margin:4px 0 0;color:#f8f1daa3;font-size:.84rem;font-weight:700}.collection-header button{flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border:1px solid rgba(248,241,218,.24);border-radius:999px;color:#f8f1da;background:#0c121ba8;cursor:pointer}.collection-header button:hover{border-color:#ffb0a899;color:#ffb0a8}.collection-empty{margin:12vh auto;color:#f8f1da99;font-size:.96rem;font-weight:700;text-align:center}.collection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:clamp(14px,1.8vw,22px)}.collection-card{--rarity: #9fb0c4;position:relative;display:flex;flex-direction:column;border:1px solid color-mix(in srgb,var(--rarity) 45%,transparent);border-radius:14px;overflow:hidden;background:linear-gradient(180deg,color-mix(in srgb,var(--rarity) 10%,transparent),transparent 40%),#10151d;box-shadow:0 1px color-mix(in srgb,var(--rarity) 30%,transparent) inset;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease}.collection-card:hover{transform:translateY(-4px);border-color:var(--rarity);box-shadow:0 16px 40px #00000080,0 0 22px color-mix(in srgb,var(--rarity) 32%,transparent)}.collection-card[data-tier=Epic],.collection-card[data-tier=Legendary]{box-shadow:0 0 0 1px var(--rarity) inset}.collection-thumb{position:relative;aspect-ratio:3 / 4;background:#05080d}.collection-thumb img{width:100%;height:100%;object-fit:cover;display:block}.collection-tier-badge{position:absolute;top:8px;left:8px;padding:3px 9px;border-radius:999px;background:color-mix(in srgb,var(--rarity) 22%,rgba(6,9,15,.86));border:1px solid color-mix(in srgb,var(--rarity) 60%,transparent);color:var(--rarity);font-size:.6rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.collection-count{position:absolute;top:8px;right:8px;padding:3px 8px;border-radius:999px;background:#06090fd1;color:var(--rarity);font-size:.74rem;font-weight:900}.collection-meta{display:flex;flex-direction:column;gap:5px;padding:11px 12px 13px}.collection-meta h3{margin:0;color:#f8f1da;font-size:.84rem;font-weight:800;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.collection-stats{display:grid;gap:3px;margin:5px 0 2px}.collection-stat{display:flex;align-items:center;gap:6px}.collection-stat-label{width:12px;color:#f8f1da9e;font-size:.6rem;font-weight:900}.collection-stat-track{flex:1;height:5px;border-radius:999px;background:#f8f1da24;overflow:hidden}.collection-stat-fill{display:block;height:100%;border-radius:999px;background:var(--rarity)}.collection-meta a,.collection-meta .collection-source{margin-top:2px;color:#9fdfffcc;font-size:.72rem;font-weight:700;text-decoration:none}.collection-meta a:hover{text-decoration:underline}.detail-overlay{--rarity: #9fb0c4;position:absolute;inset:0;z-index:40;display:grid;grid-template-columns:1fr minmax(280px,380px);background:radial-gradient(circle at 40% 40%,#0c121beb,#04060af5);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px)}.detail-close{position:absolute;top:clamp(16px,3vw,30px);right:clamp(16px,3vw,30px);z-index:3;display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(248,241,218,.24);border-radius:999px;color:#f8f1da;background:#0c121ba8;cursor:pointer}.detail-close:hover{border-color:#ffb0a899;color:#ffb0a8}.detail-stage{position:relative;min-width:0}.detail-stage canvas{width:100%!important;height:100%!important;cursor:grab}.detail-hint{position:absolute;bottom:clamp(16px,3.5vh,34px);left:50%;transform:translate(-50%);margin:0;color:#f3f6fb66;font-size:.74rem;font-weight:700;letter-spacing:.06em;pointer-events:none}.detail-panel{overflow-y:auto;padding:clamp(24px,3vw,48px) clamp(20px,2.4vw,36px);border-left:1px solid rgba(248,241,218,.1);background:#080c1299;color:#f3f6fb}.detail-tier{display:inline-block;padding:4px 12px;border-radius:999px;border:1px solid color-mix(in srgb,var(--rarity) 60%,transparent);background:color-mix(in srgb,var(--rarity) 18%,transparent);color:var(--rarity);font-size:.68rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.detail-panel h2{margin:14px 0 2px;font-size:clamp(1.3rem,2vw,1.7rem);font-weight:900;line-height:1.12}.detail-category{margin:0 0 20px;color:#f3f6fb8f;font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.detail-stats{display:grid;gap:16px}.detail-stat-head{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:5px}.detail-stat-head span{font-size:.86rem;font-weight:800}.detail-stat-head strong{color:var(--rarity);font-size:1rem;font-weight:900}.detail-stat-track{height:7px;border-radius:999px;background:#ffffff1a;overflow:hidden}.detail-stat-track span{display:block;height:100%;border-radius:999px;background:var(--rarity)}.detail-formula{margin:6px 0 0;color:#f3f6fb80;font-size:.74rem;font-weight:600;line-height:1.35}.detail-source{display:grid;gap:4px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(248,241,218,.1);font-size:.8rem;font-weight:700}.detail-source a{color:var(--rarity);text-decoration:none}.detail-source a:hover{text-decoration:underline}.detail-date{color:#f3f6fb70;font-weight:600}@media(max-width:720px){.detail-overlay{grid-template-columns:1fr;grid-template-rows:1fr auto}.detail-panel{border-left:none;border-top:1px solid rgba(248,241,218,.1);max-height:44vh}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}