:root{--bg-dark: #0a0e1a;--bg-card: #141927;--bg-card-light: #1c2237;--primary: #c8a84e;--primary-dark: #a08030;--accent: #4ecdc4;--danger: #ff6b6b;--success: #51cf66;--text: #e8e8e8;--text-muted: #8892a4;--border: #2a3050;--rarity-common: #9e9e9e;--rarity-uncommon: #4caf50;--rarity-rare: #2196f3;--rarity-ultra-rare: #9c27b0;--rarity-secret-rare: #ffc107;--rarity-epic: #ff5722;--element-feu: #ff5722;--element-eau: #2196f3;--element-air: #4caf50;--element-terre: #795548}body{margin:0;font-family:Inter,sans-serif;background:var(--bg-dark);color:var(--text);overflow:hidden;height:100dvh;width:100vw}#app{height:100dvh;width:100vw}.app{height:100dvh;display:flex;flex-direction:column;max-width:430px;margin:0 auto;position:relative;overflow:hidden}.app--desktop{max-width:none}.notifications{position:fixed;top:12px;left:50%;transform:translate(-50%);z-index:9999;display:flex;flex-direction:column;gap:6px;max-width:380px;width:90%}.notification{padding:10px 16px;border-radius:10px;font-size:13px;font-weight:500;text-align:center;animation:slideDown .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.notification--info{background:#4ecdc433;border:1px solid var(--accent);color:var(--accent)}.notification--success{background:#51cf6633;border:1px solid var(--success);color:var(--success)}.notification--error{background:#ff6b6b33;border:1px solid var(--danger);color:var(--danger)}@keyframes slideDown{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.bottom-nav{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:4px;padding:8px max(6px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px));background:var(--bg-card);border-top:1px solid var(--border);flex-shrink:0;min-height:calc(64px + env(safe-area-inset-bottom,0px))}.nav-btn{display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:none;color:var(--text-muted);cursor:pointer;width:100%;min-width:0;padding:6px 4px;border-radius:8px;transition:all .2s}.nav-btn.active{color:var(--primary)}.nav-btn:active{transform:scale(.95)}.nav-icon{font-size:clamp(18px,5vw,22px)}.nav-label{width:100%;font-size:clamp(8px,2.4vw,10px);font-weight:600;text-transform:uppercase;letter-spacing:.3px;white-space:normal;text-align:center;line-height:1.1}.nav-label--inventory{font-size:clamp(7px,2.1vw,9px)}