.crate-view.keys-design{--crate-accent:#82c8f0;padding:0;overflow:hidden;background:linear-gradient(135deg,#24201e,#141516);border:1px solid #ffffff16;border-radius:20px;box-shadow:0 24px 65px #0005}
.keys-design .crate-tabs{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding:18px;margin:0;border-bottom:1px solid #ffffff0c;background:#10111280}
.keys-design .crate-tabs button{position:relative;padding:17px 8px;border-radius:10px;border:1px solid transparent;background:transparent;color:#a9a39e;font-size:13px;font-weight:700;transition:background .2s,color .2s,border-color .2s}
.keys-design .crate-tabs button:before{content:'';display:inline-block;width:7px;height:7px;background:var(--tab-color);border-radius:50%;margin-right:9px;box-shadow:0 0 12px color-mix(in srgb,var(--tab-color) 40%,transparent)}
.keys-design .crate-tabs button:hover{background:#ffffff08;color:#fff}
.keys-design .crate-tabs button.active{background:color-mix(in srgb,var(--tab-color) 12%,#191919);color:#fff;border-color:color-mix(in srgb,var(--tab-color) 35%,transparent)}
.keys-design .crate-layout{grid-template-columns:minmax(220px,.85fr) minmax(0,1.4fr);gap:36px;padding:32px;align-items:center}
.keys-design .crate-offer{position:relative;padding:8px 0 12px}
.keys-design .crate-offer:before{content:'';position:absolute;inset:0 0 30%;background:radial-gradient(ellipse,color-mix(in srgb,var(--crate-accent) 16%,transparent),transparent 67%);pointer-events:none}
.keys-design .crate-preview{position:relative;max-width:260px;margin:0 auto 14px;filter:drop-shadow(0 16px 16px #0009);animation:crate-drift 5s ease-in-out infinite}
.keys-design .crate-offer h3{font-size:30px;letter-spacing:-1px;color:#fff5eb;margin:4px 0 10px}
.keys-design .crate-offer p{font-size:13px;color:#a99e94;margin:0 0 24px}
.keys-design .crate-offer .choose{align-items:center;border:1px solid #efbb8260;border-radius:10px;padding:17px 18px;background:linear-gradient(115deg,#c98250,#edb57f);color:#25150b;box-shadow:0 6px 20px #0003;transition:filter .2s,transform .2s;font-size:14px}
.keys-design .crate-offer .choose:hover{filter:brightness(1.12);transform:translateY(-2px)}
.keys-design .crate-offer .choose strong{font-size:20px}
.keys-design .inventory-wrap{background:linear-gradient(145deg,#252628,#1a1b1d);border:1px solid #ffffff12;padding:22px;border-radius:14px;box-shadow:0 12px 30px #0003;color:#eee}
.keys-design .inventory-title{font-family:inherit;font-size:17px;font-weight:700;margin-bottom:20px;display:flex;align-items:center;gap:10px}
.keys-design .inventory-title:before{content:'';width:4px;height:19px;border-radius:3px;background:var(--crate-accent)}
.keys-design .inventory-grid{gap:5px}
.keys-design .inventory-slot{border:1px solid #ffffff12;border-radius:5px;background:linear-gradient(145deg,#424347,#303134);padding:5px;box-shadow:inset 0 1px #ffffff07;transition:background .15s,border-color .15s,transform .15s}
.keys-design .empty-slot{background:#11131570;border-color:#ffffff05;box-shadow:none}
.keys-design button.inventory-slot:hover,.keys-design button.inventory-slot:focus-visible{background:color-mix(in srgb,var(--crate-accent) 18%,#343537);border-color:var(--crate-accent);outline:none;transform:translateY(-2px);box-shadow:0 3px 12px #0006}
.keys-design .stack-count{font-size:12px;right:3px;bottom:1px}
.keys-design .inventory-help{font-family:inherit;font-size:11px;line-height:1.6;color:#93969c;margin:18px 0 0;padding-top:14px;border-top:1px solid #ffffff09}
@keyframes crate-drift{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-9px) rotate(2deg)}}
.kits-design .crate-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}
.kits-design .crate-tabs button{--tab-color:#e49b64}
.kits-design .crate-tabs button:nth-child(2){--tab-color:#f3cf80}
.kits-design .kit-icon{position:relative;width:150px;height:150px;margin:26px auto;filter:drop-shadow(0 14px 18px #0008);animation:crate-drift 5s ease-in-out infinite}
.kits-design .kit-equipment{padding-top:20px;border-top:1px solid #ffffff0d;gap:9px}
.kits-design .kit-equipment small{color:#aaa3a0;font:10px/1.5 Arial,sans-serif;margin-top:9px}
.rank-comparison{padding:24px;background:linear-gradient(135deg,#24201e,#141516);border:1px solid #ffffff16;border-radius:20px;box-shadow:0 24px 65px #0005}
.rank-comparison table{border-spacing:0 8px}
.rank-comparison thead th{padding:24px 18px 18px;vertical-align:middle}
.rank-comparison .rank-heading{background:radial-gradient(ellipse at 50% 25%,#c982501c,transparent 65%),#ffffff03;border:1px solid #ffffff0b;border-radius:14px}
.rank-comparison .rank-plus{background:radial-gradient(ellipse at 50% 25%,#f3cf8023,transparent 65%),#ffffff04;border-color:#efbb8238}
.rank-comparison .rank-heading .rank-mark{width:125px;height:125px;animation:crate-drift 5s ease-in-out infinite}
.rank-comparison .rank-plus .rank-mark{animation-delay:-2s}
.rank-comparison .rank-heading h3{font-size:28px;letter-spacing:-.7px;color:#fff3e8;margin:12px 0}
.rank-comparison .rank-cost{font-size:27px;color:#ffd6a3;font-weight:700}
.rank-comparison .rank-heading small{display:block;line-height:1.5;font-size:11px;color:#a99e94}
.rank-comparison .rank-heading .choose{border-radius:9px;padding:14px 8px;border:1px solid #efbb8250;background:linear-gradient(115deg,#c98250,#edb57f);color:#25150b;box-shadow:0 6px 20px #0003;transition:transform .2s,filter .2s}
.rank-comparison .rank-heading .choose:hover{transform:translateY(-2px);filter:brightness(1.12)}
.rank-comparison .feature-star{width:70px;height:70px;line-height:70px;margin:0 auto 16px;border:1px solid #c9825033;border-radius:18px;background:#c982500c;font-size:30px}
.rank-comparison .feature-heading{font-size:11px;letter-spacing:2px;color:#b8a79b}
.rank-comparison tbody tr{transition:background .18s}
.rank-comparison tbody tr:nth-child(odd){background:#ffffff04}
.rank-comparison tbody tr:hover{background:#c9825010}
.rank-comparison tbody th{color:#c7bcb2;padding:16px;border-radius:8px 0 0 8px}
.rank-comparison tbody td:last-child{background:#f0b98107;border-radius:0 8px 8px 0}
.rank-comparison .included{color:#f0b981;font-size:19px}
@media(max-width:600px){.rank-comparison{padding:10px;border-radius:14px}.rank-comparison thead th{padding:16px 6px 8px}.rank-comparison .rank-heading .rank-mark{width:75px;height:75px}.rank-comparison .rank-heading h3{font-size:19px}.rank-comparison .rank-cost{font-size:20px}.rank-comparison .rank-heading small{font-size:10px}.rank-comparison .rank-heading .choose{font-size:10px;padding:12px 4px}.rank-comparison tbody th{padding:11px 7px}.rank-comparison .feature-star{width:48px;height:48px;line-height:48px;font-size:24px}.rank-comparison .feature-heading{font-size:9px;letter-spacing:1px}.kits-design .kit-icon{width:110px;height:110px;margin:15px auto}}
@media(prefers-reduced-motion:reduce){.kits-design .kit-icon,.rank-comparison .rank-heading .rank-mark{animation:none}.rank-comparison *{transition:none!important}}
@media(max-width:760px){.keys-design .crate-layout{grid-template-columns:1fr;padding:22px;gap:22px}.keys-design .crate-preview{max-width:200px}.keys-design .crate-offer{max-width:360px;width:100%;margin:auto}.keys-design .crate-tabs{gap:3px;padding:10px}.keys-design .crate-tabs button{font-size:11px;padding:13px 3px}.keys-design .crate-tabs button:before{display:block;margin:0 auto 8px}.keys-design .inventory-wrap{padding:15px}}
@media(max-width:420px){.keys-design .crate-layout{padding:14px}.keys-design .inventory-grid{gap:3px}.keys-design .inventory-slot{padding:2px}.keys-design .stack-count{font-size:10px}}
@media(prefers-reduced-motion:reduce){.keys-design .crate-preview{animation:none}.keys-design *{transition:none!important}}
.cart-header{display:flex;align-items:center;justify-content:space-between;padding:24px 28px;border-bottom:1px solid #ffffff10}.cart-header h2{margin:0;font-size:25px}.cart-header button{background:none;border:0;color:#b8a79b;font-size:30px;cursor:pointer}
#cartDialog{width:min(1050px,calc(100vw - 32px));max-width:1050px;padding:0;border:1px solid #80503970;border-radius:18px;background:#1b1917;color:#e8d7c7;max-height:88vh;overflow:auto;box-shadow:0 30px 100px #0009}#cartDialog::backdrop{background:#000a;backdrop-filter:blur(5px)}.cart-layout{display:grid;grid-template-columns:minmax(0,1fr) 280px;gap:28px;padding:28px}.cart-row{display:grid;grid-template-columns:90px minmax(0,1fr) auto;gap:18px;padding:22px 0;border-bottom:1px solid #ffffff0c}.cart-row:first-child{padding-top:0}.cart-row img{width:90px;height:90px;object-fit:contain}.cart-row h3{font-size:18px;margin:0 0 8px}.cart-row p{font-size:12px;color:#b8a79b;margin:0 0 16px}.cart-row>strong{color:#ffd6a3}.cart-controls{display:flex;align-items:center;gap:16px;flex-wrap:wrap;font-size:12px}.cart-controls select{padding:5px 9px}.cart-controls button{background:none;border:0;color:#f0b981;padding:0;cursor:pointer}.cart-summary{align-self:start;padding:22px;border:1px solid #80503960;border-radius:12px;background:linear-gradient(145deg,#30251d,#211c18)}.cart-summary h3{margin:0 0 20px;font-size:19px}.cart-summary p{color:#b8a79b;font-size:12px;line-height:1.6}.cart-total{display:block;color:#ffd6a3;font-size:32px;margin:12px 0 20px}.cart-summary .choose{width:100%;margin:8px 0!important;border-radius:8px}.cart-summary button:disabled{opacity:.4;cursor:not-allowed}.cart-empty{padding:30px 0;color:#b8a79b}@media(max-width:700px){.cart-layout{grid-template-columns:1fr;padding:18px}.cart-row{grid-template-columns:60px minmax(0,1fr);gap:12px}.cart-row img{width:60px;height:60px}.cart-row>strong{grid-column:2}.cart-header{padding:18px}.cart-header h2{font-size:21px}}
.item-tooltip{max-width:min(320px,calc(100vw - 24px));max-height:calc(100vh - 24px);padding:16px 18px;background:linear-gradient(140deg,#29231ff7,#171719fa);border:1px solid #c9825060;border-radius:12px;box-shadow:0 14px 40px #0008,inset 0 1px #ffffff08;backdrop-filter:blur(12px);font:12px/1.65 Arial,sans-serif;color:#e8d7c7;text-shadow:none;overflow-wrap:anywhere}.item-tooltip .tooltip-name{font-size:15px;font-weight:700;color:#ffd6a3;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #ffffff0c}.item-tooltip .tooltip-enchant{color:#b9afd5}.item-tooltip .tooltip-lore{color:#c3b7ad;min-height:5px}.item-tooltip .tooltip-meta{color:#ac9786;font-size:11px;margin:12px 0 6px;padding-top:10px;border-top:1px solid #ffffff0a}
