.earned-crate-preview{color:#d3dce0;max-width:1240px;margin:auto;padding:25px 30px 55px}.supply-demo-bar{border-bottom:1px solid #a0b0bb22;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;padding-bottom:16px;display:flex}.supply-demo-bar>span{letter-spacing:.12em;color:#b6a67f;font-size:9px}.earned-crate-preview button{color:#b9c7cf;font:inherit;cursor:pointer;background:#1b2933;border:1px solid #81939e44;justify-content:center;align-items:center;gap:7px;padding:9px 13px;font-size:12px;display:inline-flex}.earned-crate-preview button[aria-pressed=true]{color:#d8c48e;background:#b5a16e15;border-color:#b5a16e}.earned-crate-preview button:disabled{opacity:.5;cursor:default}.earned-crate-preview button:focus-visible{outline-offset:3px;outline:2px solid #d2bd87}.supply-demo-bar>div{flex-wrap:wrap;gap:4px;display:flex}.earned-crate-preview>header{margin:35px 0 25px}.earned-crate-preview>header>span,.supply-contents header span{letter-spacing:.15em;color:#a8b9c5;font-size:10px}.earned-crate-preview h1{margin:12px 0;font-size:clamp(32px,4.7vw,57px);line-height:1}.earned-crate-preview>header>p{color:#8eabbc;font-size:13px}.supply-opening-stage{background:radial-gradient(at 35%,#859da41b,#0000 60%),linear-gradient(135deg,#21313d,#16232d);border-top:1px solid #a8b9c522;border-bottom:1px solid #a8b9c522;justify-content:center;align-items:center;gap:35px;min-height:470px;padding:30px;display:flex;position:relative;overflow:hidden}.supply-floor{pointer-events:none;border:1px solid #c0c6b212;border-radius:50%;height:110px;position:absolute;bottom:25px;left:7%;right:7%;transform:perspective(400px)rotateX(50deg)}.supply-case{filter:drop-shadow(0 20px 18px #0004);width:48%;max-width:490px;position:relative}.supply-open-copy{flex:1;max-width:370px;position:relative}.supply-open-copy>span{letter-spacing:.15em;color:#c9b785;font-size:10px}.supply-open-copy h2{margin:12px 0;font-size:36px}.supply-open-copy p{color:#96aebd;max-width:330px;font-size:14px;line-height:1.6}.earned-crate-preview .supply-primary{color:#19272f;background:#c7b483;border-color:#c7b483;min-height:43px;padding:12px 24px;font-size:15px}.supply-rules{color:#9aafbc;flex-wrap:wrap;justify-content:center;gap:24px;padding:20px;font-size:11px;display:flex}.supply-rules>span{align-items:center;gap:6px;display:flex}.supply-contents>header{justify-content:space-between;align-items:end;gap:15px;margin:25px 0 18px;display:flex}.supply-contents h2{margin:8px 0 0;font-size:27px}.supply-contents header p{color:#9aafbc;font-size:12px}.supply-reward-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;display:grid}.supply-reward-grid article{background:#1c2b35;border:1px solid #a7b7bf18;border-bottom:2px solid #90aebc;padding:13px}.supply-reward-grid article>small{color:#92a8b6;margin-top:12px;font-size:10px;display:block}.supply-reward-grid h3{margin:6px 0;font-size:19px}.supply-reward-grid article>span{color:#b9c6c9;align-items:center;gap:5px;font-size:10px;display:flex}.supply-reward-grid .supply-owned{border-bottom-color:#596e78}.supply-reward-grid .supply-owned .supply-reward-art{opacity:.45}.supply-reward-art{height:120px;color:var(--reward-color);background:radial-gradient(#8aabb814,#0000 70%);justify-content:center;align-items:center;display:flex;position:relative}.supply-reward-art>svg{filter:drop-shadow(0 6px 4px #0006);width:85px;height:85px}.supply-mini-card{background:linear-gradient(125deg, color-mix(in srgb, var(--reward-color) 25%, #15222c), #15222c);border-left:3px solid var(--reward-color);border-bottom:1px solid var(--reward-color);width:150px;height:85px;padding:12px;position:relative;transform:rotate(-5deg);box-shadow:0 10px 13px #0004}.supply-mini-avatar{position:absolute;top:12px;right:12px}.supply-mini-card>strong{max-width:90px;font-size:9px;display:block}.supply-mini-card>span{color:#92a9b8;font-size:7px}.supply-mini-lines{gap:4px;margin-top:12px;display:flex}.supply-mini-lines i{background:var(--reward-color);opacity:.5;width:12px;height:3px}.reward-stencil .supply-mini-card{background:repeating-linear-gradient(0deg,#d4c5a414 0 1px,#0000 2px 9px),#384044;transform:rotate(4deg)}.supply-reveal{text-align:center;width:100%;animation:.5s ease-out supply-reveal-in;position:relative}.supply-new{letter-spacing:.13em;color:#b7c6a5;align-items:center;gap:5px;font-size:10px;display:inline-flex}.supply-reveal .supply-reward-art{height:160px;margin:18px 0}.supply-reveal .supply-mini-card{transform:scale(1.6)rotate(-3deg)}.supply-reveal .supply-reward-art>svg{width:140px;height:140px}.supply-reveal>small{text-transform:uppercase;letter-spacing:.12em;color:#91afbf;font-size:10px}.supply-reveal h2{margin:8px;font-size:42px}.supply-reveal p{color:#9bb2c0;max-width:470px;margin:12px auto 20px;font-size:13px}.supply-reveal-actions{flex-wrap:wrap;justify-content:center;gap:10px;display:flex}.supply-demo-equipment{color:#819cae;margin-top:12px;font-size:10px;display:block}.case-opening{animation:1.8s ease-in-out both supply-case-shift}.case-opening .supply-case-lid{transform-origin:50% 110px;animation:1.8s ease-in-out both supply-lid-open}.earned-crate-preview>footer{color:#7e99aa;max-width:820px;margin-top:28px;font-size:11px;line-height:1.7}@keyframes supply-lid-open{0%,35%{transform:translateY(0)}70%,to{transform:translateY(-32px)rotate(-4deg)}}@keyframes supply-case-shift{0%,25%{transform:translateY(0)}35%{transform:translateY(-4px)}60%,to{transform:translateY(0)}}@keyframes supply-reveal-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width:700px){.earned-crate-preview{padding:20px 16px 40px}.supply-opening-stage{flex-direction:column;gap:0;min-height:440px;padding:20px}.supply-case{width:100%;max-width:350px}.supply-open-copy{text-align:center;flex:auto}.supply-open-copy h2{margin:8px 0;font-size:29px}.supply-open-copy p{margin:8px auto 15px;font-size:12px}.supply-rules{justify-content:start;gap:10px;padding:16px 0}.supply-reward-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.supply-mini-card{width:115px;height:74px;padding:10px}.supply-mini-avatar{display:none}.supply-contents h2{font-size:23px}.supply-reveal h2{font-size:34px}.supply-reveal .supply-mini-avatar{display:block}.supply-demo-bar>div{width:100%}.supply-demo-bar button{padding:7px 9px;font-size:10px}}@media (prefers-reduced-motion:reduce){.case-opening,.case-opening .supply-case-lid,.supply-reveal{animation:none!important}}.supply-case{width:53%;max-width:550px}.supply-reel-stage{text-align:center;width:100%;min-width:0;position:relative}.supply-reel-stage>span{letter-spacing:.15em;color:#bac6cb;font-size:11px}.supply-reel-window{background:#0c1720;border-top:1px solid #71879655;border-bottom:1px solid #71879655;height:208px;margin:30px -30px 22px;position:relative;overflow:hidden;box-shadow:inset 0 16px 35px #0008}.supply-reel-window:after{content:"";pointer-events:none;z-index:2;background:linear-gradient(90deg,#13212cd9,#0000 16% 84%,#13212cd9);position:absolute;inset:0}.supply-reel-track{gap:8px;width:max-content;animation:5.7s cubic-bezier(.1,.68,.12,1) forwards supply-reel-roll;display:flex;position:absolute;top:15px;left:50%;transform:translate(-84px)}.supply-reel-tile{text-align:left;box-sizing:border-box;background:linear-gradient(#314554,#202f3d);border-bottom:4px solid #8da9be;flex:0 0 168px;width:168px;height:176px;padding:10px}.supply-reel-tile .supply-reward-art{height:115px}.supply-reel-tile .supply-mini-card{flex-shrink:0;transform:scale(.82)rotate(-4deg)}.supply-reel-tile>small{color:#99acb9;font-size:9px;display:block}.supply-reel-tile>strong{color:#d8e1e5;font-size:15px}.supply-reel-marker{z-index:3;background:#d8bb79;width:2px;position:absolute;top:0;bottom:0;left:50%;box-shadow:0 0 8px #d8bb7933}.supply-reel-marker:before{content:"";border-top:10px solid #dfc58a;border-left:7px solid #0000;border-right:7px solid #0000;position:absolute;top:0;left:-6px}.supply-reel-stage>p{color:#90a8b7;font-size:12px}@keyframes supply-reel-roll{0%{transform:translate(-84px)}to{transform:translate(-4308px)}}@media (max-width:700px){.supply-case{width:100%}.supply-reel-window{margin-left:-20px;margin-right:-20px}.supply-phase-opening{min-height:440px}}@media (prefers-reduced-motion:reduce){.supply-reel-track{animation:none;transform:translate(-4308px)}}
