:root{--accent:#e4ae39;--dark:#12151b;--panel:#1b2029;--panel-light:#262d39;--border:#ffffff14;--text:#f1f3f7;--text-muted:#8b94a6;--rarity:#4b69ff;--display:"Rajdhani", "Arial Narrow", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--dark);color:var(--text);background-image:radial-gradient(at 50% 0,#e4ae3914 0%,#0000 55%),radial-gradient(at 50% 100%,#4b69ff12 0%,#0000 55%);background-attachment:fixed;min-height:100vh;font-family:Roboto Mono,Fira Code,monospace}.hidden{display:none!important}#confetti-canvas{pointer-events:none;z-index:999;position:fixed;inset:0}#app{flex-direction:column;align-items:center;max-width:980px;min-height:100vh;margin:0 auto;padding:1.5rem 1rem 3rem;display:flex}header{text-align:center;width:100%;margin-bottom:1.5rem}h1{font-family:var(--display);color:var(--text);letter-spacing:6px;font-size:clamp(1.8rem,5.5vw,2.8rem);font-weight:700;line-height:1.1}.subtitle{font-family:var(--display);color:var(--text-muted);letter-spacing:1px;margin-top:.25rem;font-size:1.05rem}h2{font-family:var(--display);letter-spacing:3px;text-transform:uppercase;color:var(--text-muted);align-self:flex-start;margin:1.5rem 0 .75rem;font-size:1rem;font-weight:700}main,#case-view,#roll-view{flex-direction:column;align-items:center;width:100%;display:flex}#roll-view{justify-content:center;min-height:55vh;animation:.3s fade-in}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.case{cursor:pointer;width:240px;height:170px;margin:1.5rem 0 1.25rem;transition:transform .15s,filter .15s;position:relative}.case:hover,.case:focus-visible{filter:brightness(1.15);outline:none;transform:translateY(-4px)scale(1.03)}.case.opening{cursor:default}.case-body,.case-lid{background:repeating-linear-gradient(90deg,#0000 0 28px,#00000038 28px 30px),linear-gradient(#4a5364 0%,#2c3340 100%);border:2px solid #0b0d11;width:100%;position:absolute;left:0;box-shadow:inset 0 1px #ffffff26,0 14px 30px #0009}.case-body{border-top-color:var(--accent);border-radius:4px 4px 10px 10px;flex-direction:column;justify-content:center;align-items:center;gap:10px;height:110px;display:flex;bottom:0}.case-lid{transform-origin:8% 100%;z-index:2;border-radius:10px 10px 3px 3px;height:54px;top:8px}.case-latch{background:var(--accent);border:2px solid #0b0d11;border-radius:3px;width:30px;height:18px;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)}.case-emblem{background:linear-gradient(var(--accent), var(--accent)) center top / 4px 12px no-repeat, linear-gradient(var(--accent), var(--accent)) center bottom / 4px 12px no-repeat, linear-gradient(var(--accent), var(--accent)) left center / 12px 4px no-repeat, linear-gradient(var(--accent), var(--accent)) right center / 12px 4px no-repeat;width:34px;height:34px}.case-label{font-family:var(--display);letter-spacing:3px;color:#ffffffbf;font-size:.8rem;font-weight:700}.case-glow{opacity:0;z-index:1;pointer-events:none;background:radial-gradient(#ffe296f2 0%,#e4ae3973 35%,#0000 70%);width:300px;height:180px;position:absolute;top:58px;left:50%;transform:translate(-50%,-50%)scale(.3)}.case.opening{animation:.55s ease-in-out case-shake}.case.opening .case-lid{animation:.75s cubic-bezier(.3,1.4,.6,1) .5s forwards lid-open}.case.opening .case-glow{animation:.8s ease-out .55s forwards glow-burst}@keyframes case-shake{0%,to{transform:translate(0)rotate(0)}15%{transform:translate(-6px)rotate(-2deg)}30%{transform:translate(6px)rotate(2deg)}45%{transform:translate(-5px)rotate(-1.5deg)}60%{transform:translate(5px)rotate(1.5deg)}80%{transform:translate(-2px)rotate(-.5deg)}}@keyframes lid-open{to{transform:translateY(-34px)rotate(-24deg)}}@keyframes glow-burst{0%{opacity:0;transform:translate(-50%,-50%)scale(.3)}60%{opacity:1}to{opacity:1;transform:translate(-50%,-50%)scale(1.5)}}.case-hint{font-family:var(--display);letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);margin-bottom:1.5rem;font-size:.95rem}.loading .case-hint{visibility:hidden}.contents-loader{width:100%;min-height:220px;font-family:var(--display);letter-spacing:2px;text-transform:uppercase;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:1rem;font-size:.95rem;display:none}.loading .contents-loader{display:flex}.loader{background:linear-gradient(var(--accent), var(--accent)) center top / 4px 12px no-repeat, linear-gradient(var(--accent), var(--accent)) center bottom / 4px 12px no-repeat, linear-gradient(var(--accent), var(--accent)) left center / 12px 4px no-repeat, linear-gradient(var(--accent), var(--accent)) right center / 12px 4px no-repeat;width:34px;height:34px;animation:.9s cubic-bezier(.6,0,.4,1) infinite loader-spin}.loading .case{opacity:.45;cursor:progress;pointer-events:none}@keyframes loader-spin{to{transform:rotate(360deg)}}.odds{flex-wrap:wrap;justify-content:center;gap:.5rem;display:flex}.odd{background:var(--panel);border-left:4px solid var(--rarity);color:var(--text);border-radius:3px;padding:.3rem .6rem;font-size:.7rem}.card{background:linear-gradient(180deg, var(--panel-light) 0%, var(--panel) 55%, color-mix(in srgb, var(--rarity) 38%, var(--panel)) 100%);border-bottom:5px solid var(--rarity);border-radius:3px;flex-direction:column;flex:none;align-items:center;width:132px;display:flex;overflow:hidden}.card canvas{aspect-ratio:1;background:#00000073;width:100%;height:auto;display:block}.card-name{text-align:center;white-space:nowrap;text-overflow:ellipsis;width:100%;padding:.35rem .4rem;font-size:.65rem;overflow:hidden}.contents{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:8px;width:100%;display:grid}.contents .card{width:100%}.roll{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#0b0d11;width:100%;padding:14px 0;position:relative;overflow:hidden;box-shadow:inset 0 0 40px #000000e6}.roll:before,.roll:after{content:"";z-index:2;pointer-events:none;width:18%;position:absolute;top:0;bottom:0}.roll:before{background:linear-gradient(90deg,#0b0d11,#0000);left:0}.roll:after{background:linear-gradient(270deg,#0b0d11,#0000);right:0}.roll-track{will-change:transform;gap:8px;width:max-content;display:flex;position:relative;left:50%}.roll-marker{background:var(--accent);z-index:3;width:3px;position:absolute;top:0;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 0 10px #e4ae39e6}.roll-track .card.winner{box-shadow:0 0 0 2px var(--rarity), 0 0 26px var(--rarity);z-index:1;animation:.45s ease-out winner-pulse}@keyframes winner-pulse{0%{transform:scale(1)}50%{transform:scale(1.07)}to{transform:scale(1)}}.winner-preview{background:radial-gradient(circle, color-mix(in srgb, var(--rarity) 30%, #000) 0%, #000 75%);border:2px solid var(--rarity);border-radius:.5rem;justify-content:center;align-items:center;margin-bottom:.9rem;padding:.6rem;display:flex}#winner-canvas{display:block}.winner-rarity{font-family:var(--display);letter-spacing:3px;text-transform:uppercase;color:var(--rarity);font-size:.85rem;font-weight:700}.winner-name{font-family:var(--display);text-align:center;margin-bottom:.75rem;font-size:1.7rem;font-weight:700}.specs{width:100%;max-width:310px;color:var(--text-muted);grid-template-columns:1fr 1fr;gap:.35rem 2.5rem;margin-bottom:1rem;font-size:.75rem;display:grid}.spec-row{border-bottom:1px solid #ffffff0d;justify-content:space-between;padding-bottom:3px;display:flex}.spec-row span:last-child{color:var(--text);font-weight:700}.result-code{border:1px solid var(--border);color:#00e676;word-break:break-all;text-align:center;background:#000;border-radius:.35rem;width:100%;margin-bottom:.6rem;padding:.7rem .9rem;font-size:.7rem}.result-command{color:#7fb4ff}.button-group{justify-content:center;gap:.75rem;width:100%;margin-top:.4rem;display:flex}.btn-secondary,.btn-reopen{font-family:var(--display);letter-spacing:.5px;cursor:pointer;border-radius:.35rem;padding:.55rem 1rem;font-size:.95rem;font-weight:700;transition:background .15s,border-color .15s,color .15s}.btn-secondary{background:var(--panel-light);color:var(--text);border:1px solid var(--border);flex:1;max-width:200px}.btn-secondary:hover{border-color:var(--rarity)}.btn-secondary.copied{color:#00e676;background:#1a4a2a;border-color:#00e676}.btn-reopen{color:var(--text-muted);background:0 0;border:1px solid #0000;margin-top:.75rem}.btn-reopen:hover{color:var(--text);border-color:var(--border)}.modal-overlay{z-index:500;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#000000d1;justify-content:center;align-items:center;animation:.2s fade-in;display:flex;position:fixed;inset:0}.modal{background:var(--panel);border:1px solid var(--border);border-top:4px solid var(--rarity);width:calc(100vw - 2rem);max-width:420px;box-shadow:0 0 60px color-mix(in srgb, var(--rarity) 35%, transparent), 0 30px 60px #000000e6;border-radius:.6rem;flex-direction:column;align-items:center;max-height:90vh;padding:2rem 2rem 1.25rem;animation:.25s cubic-bezier(.34,1.56,.64,1) modal-in;display:flex;position:relative;overflow-y:auto}@keyframes modal-in{0%{opacity:0;transform:scale(.85)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}#modal-content{flex-direction:column;align-items:center;width:100%;display:flex}.modal-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:.35rem;padding:.25rem .4rem;font-size:1.2rem;line-height:1;transition:color .15s,background .15s;position:absolute;top:.75rem;right:.85rem}.modal-close:hover{color:var(--text);background:#ffffff14}footer{color:#ffffff38;font-family:var(--display);text-align:center;margin-top:auto;padding-top:2rem;font-size:1rem}@media (width<=520px){.roll-track .card{width:104px}}