/* CASE//LAB 11.0: interaction, depth and accessibility polish */
:root{--feel-ease:cubic-bezier(.2,.75,.2,1);--feel-shadow:0 20px 50px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.045)}
body{background:radial-gradient(ellipse at 80% -12%,rgba(195,146,74,.13),transparent 38%),radial-gradient(ellipse at 0 65%,rgba(63,108,138,.11),transparent 42%),linear-gradient(150deg,#17242e,#0d151c 85%)}
.sidebar{background:linear-gradient(155deg,rgba(23,36,46,.98),rgba(9,17,24,.98));box-shadow:12px 0 55px rgba(0,0,0,.32)}
.topbar{backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);background:rgba(21,32,42,.88)}
.casecard,.itemcard,.feature,.statcard,.inventory-summary>div{box-shadow:var(--feel-shadow);transition:transform .3s var(--feel-ease),box-shadow .3s var(--feel-ease),border-color .25s ease,filter .25s ease;transform:translateZ(0)}
.casecard:hover,.itemcard:hover{transform:translateY(-5px);box-shadow:0 25px 55px rgba(0,0,0,.42),0 0 0 1px rgba(226,190,119,.13),inset 0 1px rgba(255,255,255,.09)}
.casecard:focus-within,.itemcard:focus-within{border-color:var(--accent);box-shadow:0 0 0 2px rgba(222,188,122,.25),var(--feel-shadow)}
.case-art:before{content:'';position:absolute;inset:-40%;background:radial-gradient(circle,rgba(239,200,131,.13),transparent 48%);opacity:0;transition:opacity .35s;pointer-events:none}.casecard:hover .case-art:before{opacity:1}
.btn,.nav,.case-action button{transition:transform .16s var(--feel-ease),background .2s,border-color .2s,box-shadow .2s,filter .2s;touch-action:manipulation}
.btn:hover:not(:disabled){transform:translateY(-2px)}.btn:active:not(:disabled),.nav:active,.case-action button:active{transform:translateY(1px) scale(.985);filter:brightness(.95)}
.btn-primary{box-shadow:0 3px 0 #81683e,0 8px 20px rgba(193,149,75,.14),inset 0 1px rgba(255,255,255,.36)}.btn-primary:hover:not(:disabled){box-shadow:0 4px 0 #81683e,0 13px 30px rgba(212,164,85,.22)}
.nav.active{box-shadow:inset 3px 0 var(--accent),inset 0 1px rgba(255,255,255,.06)}
.reel-shroud{isolation:isolate}.reel-shroud:after{pointer-events:none}.reelitem{backface-visibility:hidden;will-change:auto}
.reveal-scene{background-image:radial-gradient(ellipse at 50% 40%,rgba(210,166,88,.1),transparent 55%)}
#resultModal.gold-glitch-active .reveal-scene{box-shadow:inset 0 0 110px rgba(223,168,65,.16)}
.reveal-image img{filter:drop-shadow(0 18px 35px rgba(0,0,0,.65));animation:feelReward 1.1s var(--feel-ease) both}
@keyframes feelReward{from{opacity:.15;transform:translateY(18px) scale(.9);filter:blur(7px) drop-shadow(0 18px 35px rgba(0,0,0,.65))}to{opacity:1;transform:none;filter:blur(0) drop-shadow(0 18px 35px rgba(0,0,0,.65))}}
.toast{border-left:3px solid var(--accent);border-radius:5px;backdrop-filter:blur(16px);box-shadow:0 20px 65px rgba(0,0,0,.55)}
input,select,button{accent-color:var(--accent)}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible{outline:2px solid #f4d59c;outline-offset:3px}
.feel-preferences{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:10px 0 18px;padding:10px 13px;border:1px solid rgba(223,190,126,.24);background:linear-gradient(110deg,rgba(226,184,102,.07),rgba(18,32,42,.6));color:#c9d4d9;font-size:10px;letter-spacing:.3px}
.feel-preferences label{display:flex;align-items:center;gap:7px;cursor:pointer}.feel-preferences input{width:15px;height:15px}.feel-preferences .feel-caption{color:#e3c48d;font-weight:800;letter-spacing:1.2px;margin-right:auto}
body.feel-low-motion .casecard,body.feel-low-motion .itemcard,body.feel-low-motion .btn,body.feel-low-motion .reveal-image img{animation:none!important;transition:none!important}
body.feel-low-motion .casecard:hover,body.feel-low-motion .itemcard:hover,body.feel-low-motion .btn:hover{transform:none}
@media(max-width:700px){.casecard:hover,.itemcard:hover{transform:none}.casecard:active,.itemcard:active{border-color:var(--accent);filter:brightness(1.08)}.btn{min-height:42px}.feel-preferences{gap:12px}.feel-preferences .feel-caption{width:100%}}
@media(prefers-reduced-motion:reduce){.reveal-image img{animation:none!important}.casecard:hover,.itemcard:hover,.btn:hover{transform:none!important}}
/* 11.1: collector-grade inventory, inspect staging and reward direction */
:root{--collector-gold:#e5b969;--collector-glass:rgba(20,31,40,.91)}
.itemgrid{align-items:stretch;contain:layout style}.itemcard{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(153deg,rgba(48,65,76,.86),rgba(16,26,35,.97) 76%);border-color:rgba(146,168,178,.24);box-shadow:inset 0 1px rgba(255,255,255,.075),0 9px 22px rgba(0,0,0,.22);transition:transform .32s cubic-bezier(.16,1,.3,1),box-shadow .32s,border-color .3s}
.itemcard:before{content:'';position:absolute;inset:0;pointer-events:none;z-index:0;background:radial-gradient(ellipse 85% 70% at 50% 35%,color-mix(in srgb,var(--tier,#7998ae) 20%,transparent),transparent 85%);opacity:.5;transition:opacity .35s}
.itemcard:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;border:1px solid rgba(255,255,255,.055);background:linear-gradient(130deg,rgba(255,255,255,.08),transparent 32%);opacity:.7}
.itemcard>*{position:relative;z-index:1}.itemcard:hover{transform:translateY(-7px) scale(1.012);border-color:color-mix(in srgb,var(--tier,#b7a37b) 55%,#647987);box-shadow:0 24px 46px rgba(0,0,0,.44),0 0 27px color-mix(in srgb,var(--tier,#e2ba7b) 13%,transparent),inset 0 1px rgba(255,255,255,.14)}.itemcard:hover:before{opacity:1}
.itemcard img,.cloud-item-card img{image-rendering:auto;object-fit:contain;filter:drop-shadow(0 13px 13px rgba(0,0,0,.48));transition:transform .45s cubic-bezier(.16,1,.3,1),filter .45s}.itemcard:hover img,.cloud-item-card:hover img{transform:scale(1.085) translateY(-3px);filter:drop-shadow(0 20px 18px rgba(0,0,0,.62)) saturate(1.08)}
.itemcard[data-tier="gold"],.cloud-item-card[data-tier="gold"],.itemcard[style*="--tier: #e"],.itemcard[style*="--tier:#e"]{box-shadow:inset 0 1px rgba(255,238,188,.14),0 10px 30px rgba(0,0,0,.32),0 0 25px rgba(222,162,53,.1)}
.cloud-item-card{transition:transform .3s cubic-bezier(.16,1,.3,1),box-shadow .3s,border-color .3s}.cloud-item-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.07)}
.inspect-layout{background:linear-gradient(145deg,#172630,#0b151e);box-shadow:0 35px 100px rgba(0,0,0,.8)}.inspect-stage{position:relative;isolation:isolate;background:radial-gradient(ellipse at 50% 48%,rgba(159,187,193,.11),transparent 59%),linear-gradient(145deg,#1c2c36,#0b141d)}.inspect-stage:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(118deg,rgba(255,255,255,.045),transparent 30%,rgba(0,0,0,.14) 85%)}
.inspect-stage .stage-light{filter:blur(38px);opacity:.8}.weapon-canvas-wrap{position:relative;z-index:1}.inspect-head,.inspect-stage-bottom{position:relative;z-index:2}.inspect-details{background:linear-gradient(160deg,rgba(27,42,52,.98),rgba(12,22,30,.98));box-shadow:-14px 0 40px rgba(0,0,0,.18)}
.inspect-overlay[aria-hidden="false"] .inspect-layout,.inspect-overlay[aria-hidden="false"] .public-item-inspect{animation:collectorInspectIn .45s cubic-bezier(.16,1,.3,1) both}.inspect-overlay[aria-hidden="false"] .weapon-canvas-wrap{animation:collectorWeaponIn .65s .08s cubic-bezier(.16,1,.3,1) both}
@keyframes collectorInspectIn{from{opacity:.35;transform:translateY(22px) scale(.975)}to{opacity:1;transform:none}}@keyframes collectorWeaponIn{from{opacity:.2;transform:translateY(17px) scale(.94);filter:blur(7px)}to{opacity:1;transform:none;filter:none}}
.reveal-scene{overflow:hidden;background:radial-gradient(ellipse at 50% 38%,rgba(171,144,93,.15),transparent 57%),linear-gradient(160deg,#20303b,#101923 85%)}.reveal-scene:before{content:'';position:absolute;inset:-45%;pointer-events:none;background:conic-gradient(from 30deg at 50% 50%,transparent 0deg,rgba(234,189,104,.045) 35deg,transparent 75deg,rgba(235,205,145,.045) 115deg,transparent 160deg);animation:collectorLight 22s linear infinite}.reveal-scene>*{position:relative}.reveal-image img{animation:collectorRewardIn .85s cubic-bezier(.16,1,.3,1) both;filter:drop-shadow(0 28px 24px rgba(0,0,0,.6))}
@keyframes collectorLight{to{transform:rotate(360deg)}}@keyframes collectorRewardIn{0%{opacity:0;transform:translateY(20px) scale(.88);filter:blur(8px)}60%{opacity:1;filter:blur(0) drop-shadow(0 28px 24px rgba(0,0,0,.6))}100%{transform:none;filter:drop-shadow(0 28px 24px rgba(0,0,0,.6))}}
#resultModal.collector-rare .reveal-scene{box-shadow:inset 0 0 130px rgba(210,153,59,.12),0 0 50px rgba(0,0,0,.4)}#resultModal.collector-rare .reveal-image img{animation-duration:1.15s}#resultModal.collector-gold .reveal-scene{background:radial-gradient(ellipse at 50% 40%,rgba(221,163,54,.24),transparent 58%),linear-gradient(155deg,#30291e,#101820 80%)}
@media(max-width:700px){.itemcard:hover,.cloud-item-card:hover{transform:none}.itemcard:active{transform:scale(.985);filter:brightness(1.1)}.inspect-overlay[aria-hidden="false"] .inspect-layout{animation-duration:.28s}.inspect-stage{min-height:0}.reveal-scene:before{animation:none}}
@media(prefers-reduced-motion:reduce){.itemcard,.itemcard img,.cloud-item-card,.cloud-item-card img{transition:none!important}.itemcard:hover,.cloud-item-card:hover,.itemcard:hover img,.cloud-item-card:hover img{transform:none!important}.inspect-overlay[aria-hidden="false"] .inspect-layout,.inspect-overlay[aria-hidden="false"] .weapon-canvas-wrap,.reveal-image img,.reveal-scene:before{animation:none!important}}
body.feel-low-motion .inspect-layout,body.feel-low-motion .weapon-canvas-wrap,body.feel-low-motion .reveal-scene:before{animation:none!important}
