backpack-view{display:flex;flex-direction:column;width:100%;height:100%;gap:1rem}backpack-view div[kind=tab-bar]{display:flex;gap:.25rem;background:#ffffff08;border-radius:.75rem;padding:.25rem;align-self:flex-start}backpack-view div[kind=tab-bar] button{display:flex;align-items:center;gap:.5rem;padding:.5rem 1rem;border-radius:.5rem;border:none;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;transition:all .3s;cursor:pointer;background:transparent;color:#ffffff4d}backpack-view div[kind=tab-bar] button[state=active]{background:#8b5cf633;color:#a78bfa}backpack-view div[kind=main]{flex:1;display:flex;gap:1rem;min-height:0}backpack-view div[kind=grid-panel]{flex:1;display:flex;flex-direction:column;min-height:0;background:#0003;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:1rem;padding:1rem}backpack-view div[kind=grid-scroll]{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:.75rem}backpack-view div[kind=grid-scroll]::-webkit-scrollbar{width:6px}backpack-view div[kind=grid-scroll]::-webkit-scrollbar-track{background:#ffffff0d}backpack-view div[kind=grid-scroll]::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}backpack-view div[kind=category]{border-radius:.75rem;border:1px solid rgba(255,255,255,.08);background:#ffffff05;transition:border-color .2s}backpack-view div[kind=category][state=dragover]{border-color:#8b5cf666}backpack-view div[kind=category-header]{display:flex;align-items:center;gap:.6rem;padding:.75rem 1rem;border-bottom:1px solid rgba(255,255,255,.04);cursor:pointer}backpack-view span[kind=arrow]{color:#ffffff4d;font-size:.7rem;transition:transform .2s}backpack-view span[kind=arrow][state=collapsed]{transform:rotate(-90deg)}backpack-view span[kind=cat-label]{font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:#fff9;flex:1}backpack-view span[kind=count]{font-size:.6rem;color:#fff3}backpack-view div[kind=items-grid]{display:flex;flex-wrap:wrap;gap:.75rem;padding:.75rem 1rem}backpack-view span[kind=empty]{font-size:.6rem;color:#ffffff26;letter-spacing:.2em;text-transform:uppercase;padding:.5rem 0}backpack-view div[kind=item-card]{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem;border-radius:.5rem;width:88px;background:#ffffff08;cursor:pointer;transition:all .15s;position:relative}backpack-view div[kind=item-card][state=selected]{outline:1px solid rgba(139,92,246,.6)}backpack-view div[kind=item-card]:hover{background:#ffffff0f}backpack-view span[kind=item-name]{font-size:.6rem;color:#fff9;text-align:center;line-height:1.2;text-transform:uppercase;letter-spacing:.1em;width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}backpack-view span[kind=qty]{font-size:.875rem;color:#fff}backpack-view span[kind=craftable-dot]{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;background:#34d399;animation:pulse 2s ease-in-out infinite}backpack-view div[kind=cube-wrap]{perspective:calc(var(--size, 48) * 4px);width:calc(var(--size, 48) * 1px);height:calc(var(--size, 48) * 1px)}backpack-view div[kind=cube-inner]{width:calc(var(--size, 48) * 1px);height:calc(var(--size, 48) * 1px);position:relative;transform-style:preserve-3d;animation:cubeIdle 8s linear infinite}backpack-view div[kind=cube-face]{position:absolute;width:calc(var(--size, 48) * 1px);height:calc(var(--size, 48) * 1px);border:1px solid var(--color);background:color-mix(in srgb,var(--color) 9%,transparent)}backpack-view div[kind=item-icon]{width:calc(var(--size, 48) * 1px);height:calc(var(--size, 48) * 1px);border-radius:.5rem;border:1px solid color-mix(in srgb,var(--color) 25%,transparent);background:color-mix(in srgb,var(--color) 6%,transparent);display:flex;align-items:center;justify-content:center;font-size:1.2rem}backpack-view div[kind=detail]{width:280px;background:#0003;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:1rem;overflow-y:auto;flex-shrink:0;padding:1.5rem;display:none;transition:opacity .3s;opacity:0}backpack-view div[kind=detail][state=visible]{display:block;opacity:1}backpack-view div[kind=detail-header]{display:flex;justify-content:space-between;align-items:flex-start}backpack-view div[kind=detail] h3{font-size:.875rem;letter-spacing:.2em;text-transform:uppercase;color:#fff}backpack-view button[kind=close]{background:none;border:none;color:#ffffff4d;cursor:pointer;font-size:1rem}backpack-view div[kind=detail-visual]{display:flex;justify-content:center;padding:1rem 0}backpack-view div[kind=detail] div[kind=item-icon]{width:80px;height:80px;border-radius:.75rem;font-size:2rem}backpack-view div[kind=detail-stats]{display:flex;flex-direction:column;gap:.75rem;margin-top:.5rem}backpack-view div[kind=detail-stat-row]{display:flex;justify-content:space-between;font-size:.75rem}backpack-view div[kind=detail-stat-row] span[kind=label]{color:#ffffff4d;letter-spacing:.2em;text-transform:uppercase}backpack-view div[kind=detail-stat-row] span[kind=value]{color:#fff9}backpack-view p[kind=desc]{font-size:.75rem;color:#fff6;line-height:1.6;margin-top:1rem}backpack-view div[kind=reqs]{display:flex;flex-direction:column;gap:.5rem;margin-top:1.5rem}backpack-view div[kind=reqs] span[kind=title]{font-size:.6rem;color:#ffffff40;letter-spacing:.2em;text-transform:uppercase}backpack-view div[kind=req-row]{display:flex;justify-content:space-between;font-size:.75rem}backpack-view div[kind=req-row] span[kind=label]{color:#ffffff80}backpack-view button[kind=craft]{width:100%;padding:.6rem;margin-top:1rem;border-radius:.5rem;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;transition:all .3s}backpack-view button[kind=craft][state=available]{cursor:pointer;background:#10b98133;color:#34d399;border:1px solid rgba(16,185,129,.5)}backpack-view button[kind=craft][state=available]:hover{background:#10b9814d}backpack-view button[kind=craft][state=unavailable]{cursor:not-allowed;background:#ffffff0d;color:#fff3;border:1px solid rgba(255,255,255,.05)}@media(max-width:768px){backpack-view div[kind=items-grid]{grid-template-columns:1fr}}