/* CASE//LAB 11.4 — Inventory Atelier. Presentation only; server inventory untouched. */
#inventoryView{--atelier-amber:#e3c18b}
#inventoryView>.intro{padding:27px 30px 30px;border:1px solid #6d66513d;background:radial-gradient(ellipse at 84% 12%,#c69d4a1a,transparent 55%),linear-gradient(125deg,#273744,#121d27);box-shadow:inset 0 1px #fff1,0 18px 50px #0004;position:relative;overflow:hidden}
#inventoryView>.intro:before{content:'COLLECTION / PRIVATE VAULT';position:absolute;right:25px;top:13px;font:700 9px var(--body);letter-spacing:2.4px;color:#b8a27780}
#inventoryView .inventory-summary{gap:10px}
#inventoryView .inventory-summary>div{position:relative;overflow:hidden;background:linear-gradient(145deg,#2c3c47,#16242f);border:1px solid #68768152;box-shadow:inset 0 1px #ffffff12,0 10px 28px #0003;padding:19px 21px}
#inventoryView .inventory-summary>div:after{content:'';position:absolute;width:110px;height:110px;right:-48px;top:-60px;border-radius:50%;background:#e5bb6b16;filter:blur(24px)}
#inventoryView .inventory-summary strong{color:#f2e2c5;text-shadow:0 2px 20px #dfab5833}
#inventoryView .toolbar{padding:15px;background:linear-gradient(115deg,#22323e,#17252f);border:1px solid #5c6d784d;box-shadow:0 10px 25px #0003;gap:11px}
#inventoryView .toolbar select,#inventoryView .searchwrap{border-color:#6474808a;background:#101d28;transition:border-color .2s,box-shadow .2s}
#inventoryView .toolbar select:focus,#inventoryView .searchwrap:focus-within{border-color:#e0bf86;box-shadow:0 0 0 3px #e0bf861c}
.collection-section-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin:32px 0 17px;padding-bottom:16px;border-bottom:1px solid #65727a6b}
.collection-eyebrow{font-size:9px;letter-spacing:2.3px;color:#d8b981;font-weight:800}
.collection-section-head h2{font:700 clamp(24px,3vw,38px)/1.1 var(--head);letter-spacing:.8px;margin:6px 0}
.collection-section-head p{font-size:11px;color:#94a8b4;margin:0}
.collection-live-dot{font-size:9px;letter-spacing:1.2px;color:#aac7b5;white-space:nowrap}
#inventoryGrid{gap:14px;align-items:stretch}
#inventoryGrid .itemcard{isolation:isolate;border:1px solid color-mix(in srgb,var(--tier) 35%,#54616a);border-bottom:3px solid var(--tier);background:radial-gradient(ellipse at 50% 35%,color-mix(in srgb,var(--tier) 19%,transparent),transparent 72%),linear-gradient(155deg,#34434e,#16232e 84%);box-shadow:inset 0 1px #ffffff17,0 8px 22px #0005;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s,border-color .28s}
#inventoryGrid .itemcard:before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(125deg,transparent 22%,#ffffff13 48%,transparent 68%);transform:translateX(-110%);transition:transform .65s ease;pointer-events:none}
#inventoryGrid .itemcard:hover,#inventoryGrid .itemcard:focus-visible,#inventoryGrid .itemcard:focus-within{transform:translateY(-6px);border-color:color-mix(in srgb,var(--tier) 72%,#d3c7b0);box-shadow:inset 0 1px #ffffff29,0 22px 45px #0009,0 0 24px color-mix(in srgb,var(--tier) 22%,transparent)}
#inventoryGrid .itemcard:hover:before{transform:translateX(110%)}
#inventoryGrid .itemart{position:relative;background:radial-gradient(ellipse at 50% 70%,color-mix(in srgb,var(--tier) 17%,transparent),transparent 75%)}
#inventoryGrid .itemart:after{content:'';position:absolute;inset:auto 10% 8px;height:25%;background:radial-gradient(ellipse,#0007,transparent 70%);pointer-events:none;z-index:0}
#inventoryGrid .itemart img{position:relative;z-index:1;filter:drop-shadow(0 14px 15px #0009);transition:transform .35s cubic-bezier(.2,.8,.2,1),filter .35s}
#inventoryGrid .itemcard:hover .itemart img{transform:translateY(-5px) scale(1.075);filter:drop-shadow(0 22px 20px #000b)}
#inventoryGrid .itemcard[style*="--tier"] .item-data{border-top:1px solid #ffffff12}
#inventoryGrid .item-data strong{letter-spacing:.15px}
#inventoryGrid .item-value{color:#efd5a4;font-weight:850}
#inventoryGrid .item-actions button{transition:background .18s,border-color .18s,color .18s,transform .18s}
#inventoryGrid .item-actions button:hover{transform:translateY(-2px)}
#inventoryGrid .itemcard:has(.item-value) {cursor:pointer}
#inventoryGrid .itemcard[style*="#e"],#inventoryGrid .itemcard[style*="gold"]{background-image:radial-gradient(ellipse at 50% 35%,#d4aa5c28,transparent 72%),linear-gradient(155deg,#394049,#17232c)}
#inventoryView .showcase{border:1px solid #bb9a5c55;background:radial-gradient(ellipse at 70% 0%,#bd985126,transparent 68%),linear-gradient(130deg,#2a3640,#141f28);box-shadow:0 20px 40px #0004,inset 0 1px #ffffff17;padding:20px}
#inventoryView .showcase-heading span{color:#f0d6a3;letter-spacing:2px}
#inventoryView .showcase-grid>*{transition:transform .25s,box-shadow .25s}
#inventoryView .showcase-grid>*:hover{transform:translateY(-4px);box-shadow:0 16px 28px #0006}
@media(max-width:700px){#inventoryView>.intro{padding:23px 15px}#inventoryView>.intro:before{display:none}#inventoryView .toolbar{padding:10px}#inventoryGrid{gap:9px}#inventoryGrid .itemcard:hover{transform:none}#inventoryGrid .itemcard:active{transform:scale(.985)}.collection-section-head{align-items:flex-start}.collection-live-dot{display:none}#inventoryView .showcase{padding:12px}}
@media(prefers-reduced-motion:reduce){#inventoryGrid .itemcard,#inventoryGrid .itemart img,#inventoryGrid .itemcard:before,#inventoryView .showcase-grid>*{transition:none!important}#inventoryGrid .itemcard:hover,#inventoryView .showcase-grid>*:hover{transform:none!important}}
