:root {
      --bg-main: #0B0D10;
      --surface-card: #12161C;
      --border-subtle: rgba(255, 255, 255, 0.08);
      --accent-emerald: #10B981;
      --accent-cyan: #06B6D4;
      --text-primary: #F3F4F6;
      --safe-top: env(safe-area-inset-top, 0px);
      --safe-bottom: env(safe-area-inset-bottom, 0px);
    }
    * { box-sizing: border-box; margin: 0; padding: 0; user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
    body {
      background-color: var(--bg-main);
      color: var(--text-primary);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
      min-height: 100vh;
      overflow-x: hidden;
      padding-top: var(--safe-top);
      padding-bottom: calc(76px + var(--safe-bottom));
    }
    .glass-panel { background: rgba(18, 22, 28, 0.92); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); border: 1px solid var(--border-subtle); }
    .glass-card { background: var(--surface-card); border: 1px solid var(--border-subtle); }
    .no-scrollbar::-webkit-scrollbar { display: none; }
    .tier-novice { border-color: rgba(255, 255, 255, 0.2); }
    .tier-bronze { border-color: #CD7F32; box-shadow: 0 0 15px rgba(205, 127, 50, 0.3); }
    .tier-silver { border-color: #C0C0C0; box-shadow: 0 0 15px rgba(192, 192, 192, 0.4); }
    .tier-gold { border-color: #FFD700; box-shadow: 0 0 20px rgba(255, 215, 0, 0.5); }
    .tier-diamond { border-color: #00FFFF; box-shadow: 0 0 25px rgba(0, 255, 255, 0.6); }
    .tier-mythic { border-color: #FF00FF; box-shadow: 0 0 30px rgba(255, 0, 255, 0.8); animation: pulse 2s infinite; }