/* ═══════════════════════════════════════════
   THEMES
═══════════════════════════════════════════ */
:root,
[data-theme="cyber"] {
  --bg: #050a0e;
  --panel: #0a1520;
  --panel2: #0d1c2e;
  --border: #1a3a5c;
  --accent: #00e5ff;
  --accent2: #ff6b35;
  --accent3: #7fff6e;
  --gold: #ffd700;
  --legendary: #ff4ef7;
  --mythic: #ff2020;
  --divine: #ffffff;
  --celestial: #a78bfa;
  --ethereal: #38bdf8;
  --void-col: #1a0a2e;
  --void-glow: #7c3aed;
  --primordial: #f97316;
  --omega: #facc15;
  --text: #c8dff0;
  --dim: #4a6a80;
  --glow: 0 0 12px rgba(0,229,255,0.5);
  --glow2: 0 0 12px rgba(255,107,53,0.5);
  --glow3: 0 0 18px rgba(255,78,247,0.7);
}

[data-theme="blood"] {
  --bg: #0a0000;
  --panel: #1a0000;
  --panel2: #220000;
  --border: #5a1010;
  --accent: #ff3030;
  --accent2: #ff7700;
  --accent3: #ff9999;
  --gold: #ffd700;
  --legendary: #ff6090;
  --mythic: #ff0000;
  --divine: #fff0f0;
  --celestial: #ff88cc;
  --ethereal: #ffaaaa;
  --void-col: #200000;
  --void-glow: #ff2222;
  --primordial: #ff5500;
  --omega: #ffcc00;
  --text: #ffcccc;
  --dim: #804040;
  --glow: 0 0 12px rgba(255,48,48,0.5);
  --glow2: 0 0 12px rgba(255,119,0,0.5);
  --glow3: 0 0 18px rgba(255,96,144,0.7);
}

[data-theme="forest"] {
  --bg: #020b04;
  --panel: #061209;
  --panel2: #081a0b;
  --border: #1a4a20;
  --accent: #4eff88;
  --accent2: #ffe066;
  --accent3: #88ffcc;
  --gold: #ffd700;
  --legendary: #b8ff44;
  --mythic: #44ffcc;
  --divine: #ffffff;
  --celestial: #88ff88;
  --ethereal: #aaffdd;
  --void-col: #001a04;
  --void-glow: #00ff44;
  --primordial: #ff8800;
  --omega: #ffdd00;
  --text: #c8f0d0;
  --dim: #3a6044;
  --glow: 0 0 12px rgba(78,255,136,0.5);
  --glow2: 0 0 12px rgba(255,224,102,0.5);
  --glow3: 0 0 18px rgba(184,255,68,0.7);
}

[data-theme="gold"] {
  --bg: #0a0800;
  --panel: #1a1400;
  --panel2: #221b00;
  --border: #5a4200;
  --accent: #ffd700;
  --accent2: #ff8800;
  --accent3: #ffe066;
  --gold: #ffd700;
  --legendary: #ffaa00;
  --mythic: #ff6600;
  --divine: #ffffff;
  --celestial: #ffe8a0;
  --ethereal: #ffd060;
  --void-col: #1a0e00;
  --void-glow: #ff8800;
  --primordial: #ff4400;
  --omega: #ffffff;
  --text: #f0dea0;
  --dim: #806040;
  --glow: 0 0 12px rgba(255,215,0,0.5);
  --glow2: 0 0 12px rgba(255,136,0,0.5);
  --glow3: 0 0 18px rgba(255,170,0,0.7);
}

[data-theme="void-dark"] {
  --bg: #020005;
  --panel: #0a0015;
  --panel2: #0d001e;
  --border: #2a0060;
  --accent: #9944ff;
  --accent2: #cc44ff;
  --accent3: #ff44ee;
  --gold: #bb88ff;
  --legendary: #ee44ff;
  --mythic: #aa22ff;
  --divine: #ffffff;
  --celestial: #cc88ff;
  --ethereal: #8866ff;
  --void-col: #050010;
  --void-glow: #cc00ff;
  --primordial: #ff4488;
  --omega: #ffeeaa;
  --text: #cca8ff;
  --dim: #4a2080;
  --glow: 0 0 12px rgba(153,68,255,0.5);
  --glow2: 0 0 12px rgba(204,68,255,0.5);
  --glow3: 0 0 18px rgba(238,68,255,0.7);
}

[data-theme="ice"] {
  --bg: #010a10;
  --panel: #051520;
  --panel2: #071c2a;
  --border: #104060;
  --accent: #88eeff;
  --accent2: #44ccff;
  --accent3: #aaffee;
  --gold: #88ddff;
  --legendary: #66bbff;
  --mythic: #44aaff;
  --divine: #ffffff;
  --celestial: #bbddff;
  --ethereal: #99eeff;
  --void-col: #00101a;
  --void-glow: #4488ff;
  --primordial: #ff88aa;
  --omega: #ffffee;
  --text: #b0d8e8;
  --dim: #305060;
  --glow: 0 0 12px rgba(136,238,255,0.5);
  --glow2: 0 0 12px rgba(68,204,255,0.5);
  --glow3: 0 0 18px rgba(102,187,255,0.7);
}

[data-theme="lava"] {
  --bg: #0a0200;
  --panel: #180500;
  --panel2: #220700;
  --border: #601800;
  --accent: #ff6600;
  --accent2: #ffcc00;
  --accent3: #ff8844;
  --gold: #ffd700;
  --legendary: #ff4400;
  --mythic: #ff0000;
  --divine: #ffffcc;
  --celestial: #ffaa44;
  --ethereal: #ff8822;
  --void-col: #1a0500;
  --void-glow: #ff4400;
  --primordial: #ff2200;
  --omega: #ffffff;
  --text: #f0c8a0;
  --dim: #7a4020;
  --glow: 0 0 12px rgba(255,102,0,0.5);
  --glow2: 0 0 12px rgba(255,204,0,0.5);
  --glow3: 0 0 18px rgba(255,68,0,0.7);
}

[data-theme="neon-pink"] {
  --bg: #060006;
  --panel: #120012;
  --panel2: #1a001a;
  --border: #500050;
  --accent: #ff44ff;
  --accent2: #ff0088;
  --accent3: #ff88ff;
  --gold: #ffaaff;
  --legendary: #ff00ff;
  --mythic: #cc00ff;
  --divine: #ffffff;
  --celestial: #ff88cc;
  --ethereal: #ffaaee;
  --void-col: #0a000a;
  --void-glow: #ff00cc;
  --primordial: #ff4488;
  --omega: #ffeeaa;
  --text: #f0c0f0;
  --dim: #804080;
  --glow: 0 0 12px rgba(255,68,255,0.5);
  --glow2: 0 0 12px rgba(255,0,136,0.5);
  --glow3: 0 0 18px rgba(255,0,255,0.7);
}

[data-theme="matrix"] {
  --bg: #000500;
  --panel: #000d00;
  --panel2: #001200;
  --border: #004400;
  --accent: #00ff41;
  --accent2: #00cc33;
  --accent3: #44ff66;
  --gold: #aaff00;
  --legendary: #00ff99;
  --mythic: #00ffcc;
  --divine: #ccffcc;
  --celestial: #88ff44;
  --ethereal: #66ff88;
  --void-col: #000800;
  --void-glow: #00ff66;
  --primordial: #ff6600;
  --omega: #ffffff;
  --text: #90ff90;
  --dim: #206020;
  --glow: 0 0 12px rgba(0,255,65,0.5);
  --glow2: 0 0 12px rgba(0,204,51,0.5);
  --glow3: 0 0 18px rgba(0,255,153,0.7);
}

[data-theme="retro"] {
  --bg: #1a0a00;
  --panel: #2a1800;
  --panel2: #331e00;
  --border: #7a5020;
  --accent: #ff8800;
  --accent2: #ffcc00;
  --accent3: #ff6600;
  --gold: #ffd700;
  --legendary: #ff4400;
  --mythic: #ff0000;
  --divine: #ffffcc;
  --celestial: #ffaa00;
  --ethereal: #ff8844;
  --void-col: #0a0500;
  --void-glow: #ff6600;
  --primordial: #ff2200;
  --omega: #ffffff;
  --text: #f0c880;
  --dim: #806040;
  --glow: 0 0 12px rgba(255,136,0,0.5);
  --glow2: 0 0 12px rgba(255,204,0,0.5);
  --glow3: 0 0 18px rgba(255,68,0,0.7);
}

/* ═══════════════════════════════════════════
   BASE
═══════════════════════════════════════════ */
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  background: var(--bg);
  color: var(--text);
  font-family: 'Share Tech Mono', monospace;
  min-height: 100vh;
  overflow-x: hidden;
  cursor: crosshair;
  transition: background 0.4s, color 0.4s;
}
body::before {
  content: '';
  position: fixed; inset: 0;
  background: repeating-linear-gradient(0deg, transparent, transparent 2px, rgba(0,0,0,0.07) 2px, rgba(0,0,0,0.07) 4px);
  pointer-events: none; z-index: 9999;
}
body::after {
  content: '';
  position: fixed; inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.03'/%3E%3C/svg%3E");
  pointer-events: none; z-index: 9998; opacity: 0.4;
}

/* ═══════════════════════════════════════════
   LAYOUT
═══════════════════════════════════════════ */
#app { max-width: 1360px; margin: 0 auto; padding: 14px; min-height: 100vh; display: flex; flex-direction: column; gap: 10px; }
header { display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--border); padding-bottom: 10px; flex-wrap: wrap; gap: 6px; }
.logo { font-family: 'Orbitron', sans-serif; font-weight: 900; font-size: 1.5rem; color: var(--accent); text-shadow: var(--glow); letter-spacing: 2px; }
.logo span { color: var(--accent2); text-shadow: var(--glow2); }
.header-right { display: flex; align-items: center; gap: 8px; font-size: 0.78rem; color: var(--dim); flex-wrap: wrap; }
.prestige-badge { background: linear-gradient(135deg,#4a0080,#ff4ef7); color:#fff; padding:3px 10px; border-radius:20px; font-family:'Orbitron',sans-serif; font-size:0.65rem; font-weight:700; box-shadow:var(--glow3); display:none; }
.main-grid { display: grid; grid-template-columns: 1fr 360px; gap: 10px; flex: 1; }
.left-col, .right-col { display: flex; flex-direction: column; gap: 10px; }

/* ═══════════════════════════════════════════
   PANELS
═══════════════════════════════════════════ */
.panel { background: var(--panel); border: 1px solid var(--border); border-radius: 4px; padding: 14px; position: relative; overflow: hidden; transition: background 0.4s, border-color 0.4s; }
.panel::before { content:''; position:absolute; top:0;left:0;right:0; height:2px; background:linear-gradient(90deg,transparent,var(--accent),transparent); opacity:0.5; }
.panel-title { font-family:'Orbitron',sans-serif; font-size:0.6rem; letter-spacing:3px; color:var(--accent); text-transform:uppercase; margin-bottom:10px; opacity:0.8; }

/* ═══════════════════════════════════════════
   STATS
═══════════════════════════════════════════ */
.stats-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; }
.stat-box { background:var(--panel2); border:1px solid var(--border); border-radius:3px; padding:8px 10px; text-align:center; }
.stat-label { font-size:0.6rem; color:var(--dim); letter-spacing:1px; text-transform:uppercase; margin-bottom:3px; }
.stat-value { font-family:'VT323',monospace; font-size:1.5rem; color:var(--accent); text-shadow:var(--glow); line-height:1; }
.stat-value.orange     { color:var(--accent2); text-shadow:var(--glow2); }
.stat-value.green      { color:var(--accent3); text-shadow:0 0 10px rgba(127,255,110,0.5); }
.stat-value.gold       { color:var(--gold); text-shadow:0 0 12px rgba(255,215,0,0.6); }
.stat-value.pink       { color:var(--legendary); text-shadow:var(--glow3); }
.stat-value.celestial-stat { color:var(--celestial); text-shadow:0 0 12px rgba(167,139,250,0.7); }
.stat-value.ethereal-stat  { color:var(--ethereal); text-shadow:0 0 12px rgba(56,189,248,0.7); }
.stat-value.void-stat      { color:var(--void-glow); text-shadow:0 0 16px var(--void-glow); }

/* ═══════════════════════════════════════════
   LUCK XP BAR
═══════════════════════════════════════════ */
.luck-bar-wrap { margin-top: 8px; }
.luck-bar-header { display:flex; justify-content:space-between; align-items:center; font-size:0.7rem; color:var(--dim); margin-bottom:4px; }
.luck-bar-header strong { color: var(--gold); font-size: 0.8rem; }
.luck-bar-outer { height: 10px; background: #060f18; border-radius: 3px; overflow: hidden; border: 1px solid var(--border); }
.luck-bar-fill { height:100%; border-radius:3px; transition: width 0.3s ease, background 0.5s ease; }

/* ═══════════════════════════════════════════
   RARITY ODDS
═══════════════════════════════════════════ */
.odds-row { display:flex; gap:5px; flex-wrap:wrap; margin-top:8px; }
.odds-chip { font-size:0.68rem; padding:2px 7px; border-radius:2px; border:1px solid; font-family:'VT323',monospace; white-space:nowrap; }
.odds-chip.common    { color:#c8dff0; border-color:#2a4a60; background:rgba(200,223,240,0.05); }
.odds-chip.rare      { color:#4fc3f7; border-color:#1a5a80; background:rgba(79,195,247,0.07); }
.odds-chip.epic      { color:var(--accent2); border-color:#803020; background:rgba(255,107,53,0.07); }
.odds-chip.legendary { color:var(--legendary); border-color:#601060; background:rgba(255,78,247,0.07); }
.odds-chip.mythic    { color:var(--mythic); border-color:#800000; background:rgba(255,32,32,0.07); }
.odds-chip.divine    { color:#fff; border-color:#888; background:rgba(255,255,255,0.07); text-shadow:0 0 8px #fff; }
.odds-chip.celestial { color:var(--celestial); border-color:#5530a0; background:rgba(167,139,250,0.08); }
.odds-chip.ethereal  { color:var(--ethereal); border-color:#0070a0; background:rgba(56,189,248,0.08); }
.odds-chip.void-r    { color:var(--void-glow); border-color:#3a0060; background:rgba(124,58,237,0.1); text-shadow:0 0 8px var(--void-glow); }
.odds-chip.primordial{ color:var(--primordial); border-color:#802000; background:rgba(249,115,22,0.08); }
.odds-chip.omega     { color:var(--omega); border-color:#806000; background:rgba(250,204,21,0.08); text-shadow:0 0 8px var(--omega); animation:omegaChipPulse 1.5s ease infinite alternate; }
.odds-chip.locked    { opacity:0.25; filter:grayscale(1); }

@keyframes omegaChipPulse { from{opacity:0.7} to{opacity:1} }

/* ═══════════════════════════════════════════
   ROLL AREA
═══════════════════════════════════════════ */
.roll-area { text-align:center; padding:20px 14px; }
#roll-result { font-family:'VT323',monospace; font-size:3rem; min-height:56px; color:var(--gold); text-shadow:0 0 20px rgba(255,215,0,0.7); transition:color 0.2s; letter-spacing:2px; margin-bottom:6px; }
#roll-result.common     { color:var(--text);       text-shadow:none; }
#roll-result.rare       { color:#4fc3f7;            text-shadow:0 0 15px rgba(79,195,247,0.6); }
#roll-result.epic       { color:var(--accent2);    text-shadow:var(--glow2); }
#roll-result.legendary  { color:var(--legendary);  text-shadow:var(--glow3); animation:legendaryPulse 0.5s ease infinite alternate; }
#roll-result.mythic     { color:var(--mythic);     text-shadow:0 0 20px rgba(255,32,32,0.9); animation:mythicPulse 0.4s ease infinite alternate; }
#roll-result.divine     { color:#fff;              text-shadow:0 0 30px #fff,0 0 60px rgba(200,200,255,0.5); animation:divinePulse 0.6s ease infinite alternate; }
#roll-result.celestial  { color:var(--celestial);  text-shadow:0 0 25px var(--celestial),0 0 50px rgba(167,139,250,0.4); animation:celestialPulse 0.8s ease infinite alternate; }
#roll-result.ethereal   { color:var(--ethereal);   text-shadow:0 0 30px var(--ethereal),0 0 60px rgba(56,189,248,0.5); animation:etherealPulse 0.6s ease infinite alternate; }
#roll-result.void-r     { color:var(--void-glow);  text-shadow:0 0 40px var(--void-glow),0 0 80px rgba(124,58,237,0.6); animation:voidPulse 0.3s ease infinite alternate; }
#roll-result.primordial { color:var(--primordial); text-shadow:0 0 30px var(--primordial),0 0 60px rgba(249,115,22,0.5); animation:primordialPulse 0.4s ease infinite alternate; }
#roll-result.omega      { color:var(--omega);      text-shadow:0 0 40px var(--omega),0 0 100px rgba(250,204,21,0.7); animation:omegaPulse 0.25s ease infinite alternate; }
#roll-result.glitch     { animation:glitch 0.12s steps(1) infinite; }

@keyframes legendaryPulse  { from{text-shadow:0 0 15px rgba(255,78,247,0.7)} to{text-shadow:0 0 35px rgba(255,78,247,1),0 0 60px rgba(255,78,247,0.4)} }
@keyframes mythicPulse     { from{text-shadow:0 0 15px rgba(255,32,32,0.8)} to{text-shadow:0 0 40px rgba(255,32,32,1),0 0 80px rgba(255,0,0,0.4)} }
@keyframes divinePulse     { from{text-shadow:0 0 20px #fff,0 0 40px rgba(200,200,255,0.3)} to{text-shadow:0 0 50px #fff,0 0 100px rgba(200,200,255,0.7)} }
@keyframes celestialPulse  { from{text-shadow:0 0 20px var(--celestial),0 0 40px rgba(167,139,250,0.3)} to{text-shadow:0 0 50px var(--celestial),0 0 100px rgba(167,139,250,0.6)} }
@keyframes etherealPulse   { from{text-shadow:0 0 20px var(--ethereal),0 0 40px rgba(56,189,248,0.3)} to{text-shadow:0 0 50px var(--ethereal),0 0 100px rgba(56,189,248,0.6)} }
@keyframes voidPulse       { from{text-shadow:0 0 30px var(--void-glow),0 0 60px rgba(124,58,237,0.4)} to{text-shadow:0 0 60px var(--void-glow),0 0 120px rgba(124,58,237,0.8),0 0 200px rgba(124,58,237,0.2)} }
@keyframes primordialPulse { from{text-shadow:0 0 25px var(--primordial),0 0 50px rgba(249,115,22,0.3)} to{text-shadow:0 0 55px var(--primordial),0 0 110px rgba(249,115,22,0.7)} }
@keyframes omegaPulse      { from{text-shadow:0 0 40px var(--omega),0 0 80px rgba(250,204,21,0.5)} to{text-shadow:0 0 80px var(--omega),0 0 160px rgba(250,204,21,1),0 0 300px rgba(250,204,21,0.3)} }
@keyframes glitch {
  0%  { transform:translate(0); color:var(--accent); }
  25% { transform:translate(-3px,1px) skewX(5deg); color:#ff0055; }
  50% { transform:translate(3px,-1px) skewX(-5deg); color:var(--accent3); }
  75% { transform:translate(-2px,2px); color:var(--legendary); }
  100%{ transform:translate(0); }
}

/* ═══════════════════════════════════════════
   COOLDOWN BAR
═══════════════════════════════════════════ */
.cd-wrap { margin:8px 0 14px; }
.cd-label { display:flex; justify-content:space-between; font-size:0.68rem; color:var(--dim); margin-bottom:4px; }
.cd-label span:last-child { color:var(--accent); }
.cd-bar { height:8px; background:#060f18; border-radius:3px; overflow:hidden; border:1px solid var(--border); }
.cd-fill { height:100%; border-radius:3px; background:linear-gradient(90deg,var(--accent),var(--accent3)); transition:width 0.1s linear; }

/* ═══════════════════════════════════════════
   ROLL BUTTON
═══════════════════════════════════════════ */
#roll-btn {
  font-family:'Orbitron',sans-serif; font-size:1rem; font-weight:900;
  letter-spacing:4px; padding:14px 40px; border:none; border-radius:3px;
  background:linear-gradient(135deg,var(--accent),var(--accent2));
  color:var(--bg); cursor:crosshair; transition:opacity 0.2s,transform 0.1s,box-shadow 0.2s;
  box-shadow:0 0 20px rgba(0,229,255,0.35); width:100%;
}
#roll-btn:hover:not(:disabled) { opacity:0.85; transform:scale(1.02); box-shadow:0 0 35px rgba(0,229,255,0.6); }
#roll-btn:disabled { opacity:0.3; cursor:not-allowed; transform:none; }

.auto-indicator { display:flex; align-items:center; gap:7px; font-size:0.72rem; color:var(--dim); margin-top:8px; justify-content:center; }
.auto-dot { width:8px; height:8px; border-radius:50%; background:var(--dim); transition:background 0.3s,box-shadow 0.3s; }
.auto-dot.active { background:var(--accent3); box-shadow:0 0 8px var(--accent3); animation:pulse 1s ease infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.5} }

/* ═══════════════════════════════════════════
   UPGRADES
═══════════════════════════════════════════ */
.upgrades-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:7px; }
.upgrade-card {
  background:var(--panel2); border:1px solid var(--border); border-radius:4px;
  padding:10px 8px; text-align:center; cursor:crosshair;
  transition:border-color 0.2s,background 0.2s,transform 0.1s,opacity 0.2s;
  position:relative; overflow:hidden; min-width:0;
}
.upgrade-card:hover:not(.locked-card):not(.disabled) { border-color:var(--accent); transform:translateY(-1px); background:rgba(0,229,255,0.05); }
.upgrade-card.disabled { opacity:0.55; }
.upgrade-card.maxed { border-color:var(--gold); background:rgba(255,215,0,0.05); }
.upgrade-card.locked-card { opacity:0.45; cursor:not-allowed; }
.upg-level { position:absolute; top:4px; right:6px; font-size:0.6rem; color:var(--accent); font-family:'Orbitron',sans-serif; z-index:5; }
.upg-icon  { font-size:1.3rem; margin-bottom:4px; }
.upg-name  { font-size:0.72rem; color:var(--text); font-weight:600; margin-bottom:2px; }
.upg-desc  { font-size:0.6rem; color:var(--dim); margin-bottom:6px; line-height:1.3; }
.upg-cost  { font-family:'VT323',monospace; font-size:1rem; color:var(--gold); }
.upg-lock-overlay {
  position:absolute; inset:0; background:rgba(0,0,0,0.72);
  display:flex; align-items:center; justify-content:center;
  font-size:0.65rem; color:var(--dim); border-radius:4px; z-index:10;
}

/* ═══════════════════════════════════════════
   LEVEL PANEL
═══════════════════════════════════════════ */
.level-panel { border-color:#2a4a1a; }
.level-panel::before { background:linear-gradient(90deg,transparent,var(--accent3),transparent); }
.level-panel .panel-title { color:var(--accent3); }
.level-scroll { max-height:240px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:var(--border) transparent; }
.level-scroll::-webkit-scrollbar { width:4px; }
.level-scroll::-webkit-scrollbar-thumb { background:var(--border); border-radius:2px; }
.level-row { display:flex; align-items:center; gap:7px; padding:4px 0; border-bottom:1px solid #0d1f2a; font-size:0.7rem; }
.level-row:last-child { border-bottom:none; }
.level-num { font-family:'VT323',monospace; font-size:1rem; color:var(--dim); width:26px; text-align:right; flex-shrink:0; }
.level-num.past    { color:var(--accent); }
.level-num.current { color:var(--accent3); text-shadow:0 0 8px rgba(127,255,110,0.6); }
.level-bar-mini { flex:1; height:5px; background:#060f18; border-radius:2px; overflow:hidden; }
.level-bar-mini-fill { height:100%; border-radius:2px; }
.level-bar-mini-fill.done    { background:var(--accent); }
.level-bar-mini-fill.current { background:linear-gradient(90deg,var(--accent),var(--accent3)); }
.level-tags { display:flex; gap:3px; flex-wrap:wrap; }
.level-reward-tag { font-size:0.58rem; padding:1px 5px; border-radius:2px; white-space:nowrap; }
.level-reward-tag.rarity-unlock { background:rgba(255,215,0,0.12); color:var(--gold); border:1px solid rgba(255,215,0,0.2); }
.level-reward-tag.upg-unlock   { background:rgba(0,229,255,0.1);   color:var(--accent); border:1px solid rgba(0,229,255,0.2); }
.level-reward-tag.passive       { background:rgba(127,255,110,0.08);color:var(--accent3);border:1px solid rgba(127,255,110,0.15); }
.level-reward-tag.locked { opacity:0.3; }

/* ═══════════════════════════════════════════
   PRESTIGE
═══════════════════════════════════════════ */
.prestige-panel { border-color:#4a0080; background:linear-gradient(135deg,#0a0015,#150025); }
.prestige-panel::before { background:linear-gradient(90deg,transparent,var(--legendary),transparent); }
.prestige-panel .panel-title { color:var(--legendary); }
#prestige-btn { width:100%; font-family:'Orbitron',sans-serif; font-size:0.72rem; font-weight:700; letter-spacing:2px; color:#fff; background:linear-gradient(135deg,#4a0080,#ff4ef7); border:none; padding:11px; border-radius:3px; cursor:crosshair; transition:opacity 0.2s,transform 0.1s,box-shadow 0.2s; box-shadow:0 0 20px rgba(255,78,247,0.3); margin-top:10px; }
#prestige-btn:hover:not(:disabled) { opacity:0.85; transform:scale(1.02); box-shadow:0 0 30px rgba(255,78,247,0.6); }
#prestige-btn:disabled { opacity:0.25; cursor:not-allowed; transform:none; box-shadow:none; }
.prestige-info { font-size:0.72rem; color:var(--dim); line-height:1.6; }
.prestige-info strong { color:var(--legendary); }

/* ═══════════════════════════════════════════
   LEADERBOARD
═══════════════════════════════════════════ */
.lb-row { display:flex; justify-content:space-between; align-items:center; padding:4px 0; border-bottom:1px solid #0d1f30; font-size:0.78rem; }
.lb-row:last-child { border-bottom:none; }
.lb-rank { color:var(--dim); font-size:0.68rem; width:22px; }
.lb-rank.top1 { color:var(--gold); font-family:'VT323',monospace; font-size:1rem; }
.lb-rank.top2 { color:#b0c4de; }
.lb-rank.top3 { color:var(--accent2); }
.lb-name { flex:1; margin:0 8px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lb-name.me { color:var(--accent); }
.lb-score { font-family:'VT323',monospace; font-size:1.05rem; color:var(--accent3); }

/* ═══════════════════════════════════════════
   ACHIEVEMENTS
═══════════════════════════════════════════ */
.ach-grid { display:grid; grid-template-columns:1fr 1fr; gap:5px; }
.ach-card { background:var(--panel2); border:1px solid var(--border); border-radius:3px; padding:7px 9px; display:flex; align-items:center; gap:7px; font-size:0.7rem; opacity:0.3; transition:opacity 0.4s,border-color 0.4s; }
.ach-card.unlocked { opacity:1; border-color:var(--gold); animation:achUnlock 0.5s ease; }
@keyframes achUnlock { 0%{transform:scale(1)} 40%{transform:scale(1.05);box-shadow:0 0 20px rgba(255,215,0,0.5)} 100%{transform:scale(1)} }
.ach-icon { font-size:1.1rem; flex-shrink:0; }
.ach-name { color:var(--text); font-weight:600; display:block; margin-bottom:1px; }
.ach-desc { color:var(--dim); font-size:0.62rem; display:block; }

/* ═══════════════════════════════════════════
   FLOATS & TOAST
═══════════════════════════════════════════ */
#floats { position:fixed; inset:0; pointer-events:none; z-index:1000; }
.float-text { position:absolute; font-family:'VT323',monospace; font-size:1.35rem; font-weight:700; white-space:nowrap; pointer-events:none; animation:floatUp 1.4s ease forwards; }
@keyframes floatUp { 0%{transform:translateY(0) scale(1);opacity:1} 60%{opacity:1} 100%{transform:translateY(-90px) scale(0.8);opacity:0} }

#toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(80px); background:var(--panel); border:1px solid var(--accent); border-radius:3px; padding:9px 22px; font-size:0.82rem; color:var(--accent); box-shadow:var(--glow); z-index:600; transition:transform 0.3s cubic-bezier(.175,.885,.32,1.275),opacity 0.3s; opacity:0; pointer-events:none; white-space:nowrap; }
#toast.show { transform:translateX(-50%) translateY(0); opacity:1; }
#toast.ach { border-color:var(--gold); color:var(--gold); box-shadow:0 0 12px rgba(255,215,0,0.5); }
#toast.lvl { border-color:var(--accent3); color:var(--accent3); box-shadow:0 0 12px rgba(127,255,110,0.5); }
#toast.void-toast { border-color:var(--void-glow); color:var(--void-glow); box-shadow:0 0 20px var(--void-glow); }
#toast.omega-toast { border-color:var(--omega); color:var(--omega); box-shadow:0 0 30px var(--omega); animation:toastOmega 0.5s ease infinite alternate; }
@keyframes toastOmega { from{box-shadow:0 0 20px var(--omega)} to{box-shadow:0 0 50px var(--omega),0 0 80px rgba(250,204,21,0.3)} }

/* ═══════════════════════════════════════════
   LOGIN
═══════════════════════════════════════════ */
#login-screen { position:fixed; inset:0; background:var(--bg); z-index:500; display:flex; align-items:center; justify-content:center; }
.login-box { background:var(--panel); border:1px solid var(--border); border-radius:4px; padding:34px 38px; width:380px; max-width:95vw; position:relative; overflow:hidden; }
.login-box::before { content:''; position:absolute; top:0;left:0;right:0;height:3px; background:linear-gradient(90deg,var(--accent),var(--legendary),var(--accent2)); }
.login-title { font-family:'Orbitron',sans-serif; font-weight:900; font-size:1.25rem; color:var(--accent); text-shadow:var(--glow); text-align:center; margin-bottom:4px; }
.login-sub { text-align:center; font-size:0.7rem; color:var(--dim); margin-bottom:22px; letter-spacing:1px; }
.field-group { margin-bottom:11px; }
.field-label { font-size:0.62rem; color:var(--dim); letter-spacing:2px; text-transform:uppercase; margin-bottom:4px; display:block; }
.field-input { width:100%; background:#020810; border:1px solid var(--border); border-radius:3px; color:var(--text); font-family:'Share Tech Mono',monospace; font-size:0.95rem; padding:9px 11px; outline:none; transition:border-color 0.2s,box-shadow 0.2s; }
.field-input:focus { border-color:var(--accent); box-shadow:0 0 0 2px rgba(0,229,255,0.15); }
.login-btn-row { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:18px; }
.login-btn { font-family:'Orbitron',sans-serif; font-size:0.62rem; letter-spacing:2px; font-weight:700; padding:11px 8px; border:none; border-radius:3px; cursor:pointer; transition:opacity 0.2s,transform 0.1s; }
.login-btn:hover { opacity:0.85; transform:translateY(-1px); }
.btn-login  { background:linear-gradient(135deg,var(--accent),#007a99); color:var(--bg); }
.btn-signup { background:linear-gradient(135deg,var(--accent2),#aa3300); color:#fff; }
.login-msg { margin-top:11px; font-size:0.76rem; text-align:center; min-height:18px; color:var(--accent2); }
.login-msg.ok { color:var(--accent3); }

/* ═══════════════════════════════════════════
   MODAL
═══════════════════════════════════════════ */
.modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,0.88); z-index:400; display:none; align-items:center; justify-content:center; overflow-y:auto; padding:20px; }
.modal-overlay.open { display:flex; }
.modal-box { background:var(--panel); border:1px solid #4a0080; border-radius:4px; padding:30px; width:420px; max-width:95vw; position:relative; }
.modal-box::before { content:''; position:absolute; top:0;left:0;right:0;height:3px; background:linear-gradient(90deg,transparent,var(--legendary),transparent); }
.modal-title { font-family:'Orbitron',sans-serif; font-size:0.95rem; font-weight:900; color:var(--legendary); margin-bottom:12px; letter-spacing:2px; }
.modal-body { font-size:0.78rem; line-height:1.7; color:var(--text); margin-bottom:18px; }
.modal-body strong { color:var(--legendary); }
.modal-btns { display:flex; gap:8px; }
.modal-btn { flex:1; font-family:'Orbitron',sans-serif; font-size:0.62rem; letter-spacing:2px; padding:11px; border:none; border-radius:3px; cursor:pointer; font-weight:700; transition:opacity 0.2s; }
.modal-btn:hover { opacity:0.85; }
.modal-btn.confirm { background:linear-gradient(135deg,#4a0080,#ff4ef7); color:#fff; }
.modal-btn.cancel  { background:var(--panel2); color:var(--dim); border:1px solid var(--border); }

/* ═══════════════════════════════════════════
   ADMIN PANEL
═══════════════════════════════════════════ */
.admin-modal-box { width:700px; max-width:96vw; max-height:88vh; overflow-y:auto; border-color:#880000; }
.admin-modal-box::before { background:linear-gradient(90deg,transparent,#ff4444,transparent); }
.lb-prestige { color:#ff4ef7; font-size:0.72rem; }
.lb-luck { color:#4fc3f7; font-size:0.68rem; }
/* ── Discord-style guild tag badges ── */
.lb-badge {
  display:inline-block;
  font-family:'Orbitron',sans-serif;
  font-size:0.46rem;
  font-weight:900;
  letter-spacing:0.08em;
  border-radius:3px;
  padding:2px 6px;
  vertical-align:middle;
  margin-left:5px;
  line-height:1.5;
  text-transform:uppercase;
  white-space:nowrap;
  position:relative;
  top:-1px;
}
.lb-owner  { color:#ffe066; background:#4a3200; border:1.5px solid #c8860a; box-shadow:0 0 6px rgba(200,134,10,0.4); }
.lb-owner2 { color:#ffd966; background:#3d2900; border:1.5px solid #aa7000; box-shadow:0 0 4px rgba(170,112,0,0.3); }
.lb-admin  { color:#ff8080; background:#3d0000; border:1.5px solid #cc2222; box-shadow:0 0 6px rgba(204,34,34,0.4); }
.lb-mod    { color:#57f287; background:#003320; border:1.5px solid #23a55a; box-shadow:0 0 5px rgba(35,165,90,0.35); }
.lb-og     { color:#7eb8f7; background:#00173d; border:1.5px solid #1e6ec8; box-shadow:0 0 5px rgba(30,110,200,0.35); }
.lb-vip    { color:#c77dff; background:#200040; border:1.5px solid #7c44cc; box-shadow:0 0 5px rgba(124,68,204,0.35); }
.owner-ip-row { background:rgba(255,170,0,0.04); border:1px solid rgba(255,170,0,0.12); border-radius:4px; padding:6px 8px; }
.db-tab-owner { border-color:#ffaa00 !important; color:#ffaa00 !important; }
.db-tab-owner.active { background:rgba(255,170,0,0.1) !important; }
.lb-omega { color:#facc15; font-size:0.68rem; }
.lb-me { background:rgba(0,229,255,0.06); border-radius:3px; }
.lb-tabs { display:flex; gap:6px; margin-bottom:8px; flex-wrap:wrap; }
.lb-tab { font-size:0.62rem; font-family:'Orbitron',sans-serif; letter-spacing:1px; color:var(--dim); cursor:pointer; padding:2px 8px; border-radius:3px; border:1px solid transparent; transition:all 0.2s; }
.lb-tab:hover { color:var(--accent); }
.lb-tab.active { color:var(--accent); border-color:var(--accent); background:rgba(0,229,255,0.07); }
.lb-footer { font-size:0.62rem; color:var(--dim); margin-top:8px; display:flex; gap:8px; align-items:center; }
.lb-refresh { cursor:pointer; color:var(--accent); opacity:0.6; transition:opacity 0.2s; }
.lb-refresh:hover { opacity:1; }
.lb-rows { display:flex; flex-direction:column; }
.admin-tabs { display:flex; gap:4px; margin-bottom:14px; flex-wrap:wrap; }
.admin-tab { font-family:'Orbitron',sans-serif; font-size:0.58rem; letter-spacing:2px; padding:7px 14px; border:1px solid var(--border); background:var(--panel2); color:var(--dim); border-radius:3px; cursor:pointer; transition:all 0.2s; }
.admin-tab.active { border-color:#ff4444; color:#ff4444; background:rgba(255,68,68,0.08); }
.admin-tab:hover { border-color:#ff4444; color:#ff8888; }
.admin-section { min-height:120px; }
.admin-label { font-size:0.7rem; color:var(--dim); letter-spacing:1px; margin-bottom:6px; text-transform:uppercase; }
.admin-input { width:100%; background:#020810; border:1px solid var(--border); border-radius:3px; color:var(--text); font-family:'Share Tech Mono',monospace; font-size:0.88rem; padding:7px 10px; outline:none; transition:border-color 0.2s; margin-bottom:4px; }
.admin-input:focus { border-color:#ff4444; }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin:10px 0; }
.admin-field { display:flex; flex-direction:column; gap:3px; }
.admin-field label { font-size:0.62rem; color:var(--dim); }
.admin-btn-row { display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }
.admin-btn { font-family:'Orbitron',sans-serif; font-size:0.58rem; letter-spacing:1px; padding:8px 12px; border:1px solid #ff4444; background:rgba(255,68,68,0.1); color:#ff4444; border-radius:3px; cursor:pointer; transition:all 0.2s; white-space:nowrap; }
.admin-btn:hover { background:rgba(255,68,68,0.25); }
.admin-btn.danger { border-color:#ff0000; color:#ff2020; background:rgba(255,0,0,0.05); }
.admin-btn.danger:hover { background:rgba(255,0,0,0.2); }
.owner-tab { border-color:#ffaa00 !important; color:#ffaa00 !important; }
.owner-tab.active { background:rgba(255,170,0,0.12) !important; }
.owner-btn { border-color:#ffaa00; color:#ffdd88; background:rgba(180,100,0,0.15); }
.owner-btn:hover { background:rgba(180,100,0,0.3); }
.owner-btn.danger { border-color:#ff4400; color:#ff8866; background:rgba(180,40,0,0.15); }

/* ═══════════════════════════════════════════
   THEME PICKER
═══════════════════════════════════════════ */
.theme-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:10px; }
.theme-chip { border-radius:4px; padding:10px 8px; text-align:center; cursor:pointer; border:2px solid transparent; transition:all 0.2s; font-size:0.65rem; font-family:'Orbitron',sans-serif; letter-spacing:1px; }
.theme-chip:hover { transform:scale(1.04); }
.theme-chip.active { border-color:#fff; box-shadow:0 0 14px rgba(255,255,255,0.4); }

/* ═══════════════════════════════════════════
   HEADER BTNS
═══════════════════════════════════════════ */
.logout-btn { background:none; border:1px solid var(--border); color:var(--dim); padding:4px 9px; border-radius:3px; font-family:'Share Tech Mono',monospace; font-size:0.68rem; cursor:pointer; transition:border-color 0.2s,color 0.2s; }
.logout-btn:hover { border-color:var(--accent2); color:var(--accent2); }
.header-btn { background:none; border:1px solid var(--border); color:var(--dim); padding:4px 9px; border-radius:3px; font-family:'Share Tech Mono',monospace; font-size:0.72rem; cursor:pointer; transition:border-color 0.2s,color 0.2s; }
.header-btn:hover { border-color:var(--accent); color:var(--accent); }
.theme-btn { font-size:0.85rem; }
#user-display { font-size:0.78rem; }
#user-display span { color:var(--accent); }

/* ═══════════════════════════════════════════
   SAVE STATUS
═══════════════════════════════════════════ */
#save-status { font-size:0.6rem; color:var(--dim); transition: color 0.3s; }
#save-status.saved { color: var(--accent3); }
#save-status.saving { color: var(--gold); }

/* ═══════════════════════════════════════════
   RESPONSIVE
═══════════════════════════════════════════ */
@media(max-width:900px) {
  .main-grid{grid-template-columns:1fr}
  .stats-row{grid-template-columns:repeat(4,1fr)}
  .upgrades-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:500px) {
  .stats-row{grid-template-columns:repeat(2,1fr)}
  .ach-grid{grid-template-columns:1fr}
  .theme-grid{grid-template-columns:repeat(2,1fr)}
}

/* ═══════════════════════════════════════════
   DATABASE INSPECTOR (Ctrl+I)
═══════════════════════════════════════════ */
#db-inspector {
  display: none;
  position: fixed;
  top: 0; right: 0;
  width: min(680px, 100vw);
  height: 100vh;
  z-index: 9999;
  overflow-y: auto;
  background: #000e00;
  border-left: 2px solid #00ff41;
  box-shadow: -8px 0 40px rgba(0,255,65,0.25);
  font-family: 'Share Tech Mono', monospace;
}
#db-inspector.open { display: block; }
.db-inspector-panel { padding: 0; }
.db-inspector-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px;
  background: #001a00;
  border-bottom: 1px solid #00ff41;
  color: #00ff41;
  font-size: 0.82rem;
  font-weight: bold;
  position: sticky; top: 0; z-index: 10;
}
.db-inspector-tabs {
  display: flex; gap: 2px;
  padding: 8px 10px 0;
  background: #000a00;
  border-bottom: 1px solid #222;
}
.db-tab {
  background: transparent;
  border: 1px solid #333;
  color: #555;
  padding: 4px 12px;
  cursor: pointer;
  font-family: 'Share Tech Mono', monospace;
  font-size: 0.72rem;
  border-radius: 3px 3px 0 0;
  transition: all 0.15s;
}
.db-tab.active, .db-tab:hover { background: #001a00; color: #00ff41; border-color: #00ff41; }
.db-section { padding: 12px 14px; }
.db-user-row {
  background: #050f05;
  border: 1px solid #1a3a1a;
  border-radius: 4px;
  padding: 10px 12px;
  margin-bottom: 8px;
  transition: border-color 0.2s;
}
.db-user-row:hover { border-color: #00ff41; }
.db-field-grid {
  display: grid;
  grid-template-columns: 90px 1fr 90px 1fr;
  gap: 4px 8px;
  align-items: center;
  margin-top: 6px;
}
.db-field-grid label {
  color: #666;
  font-size: 0.68rem;
  text-align: right;
}
.db-input {
  background: #000d00;
  border: 1px solid #1a3a1a;
  color: #00ff41;
  padding: 2px 6px;
  font-family: 'Share Tech Mono', monospace;
  font-size: 0.72rem;
  border-radius: 2px;
  width: 100%;
  box-sizing: border-box;
}
.db-input:focus { outline: none; border-color: #00ff41; }
.db-action-btn {
  background: #001a00;
  border: 1px solid #00aa00;
  color: #00ff41;
  padding: 3px 10px;
  cursor: pointer;
  font-family: 'Share Tech Mono', monospace;
  font-size: 0.72rem;
  border-radius: 3px;
  transition: all 0.15s;
}
.db-action-btn:hover { background: #002a00; border-color: #00ff41; }
.db-action-btn.danger { border-color: #aa0000; color: #ff4444; }
.db-action-btn.danger:hover { background: #1a0000; border-color: #ff4444; }

/* ══════════════════════════════════════
   OWNER PANEL  (rng-owner.js)
══════════════════════════════════════ */
.op-box {
  width: 860px; max-width: 97vw; max-height: 90vh; overflow-y: auto;
  border-color: #cc8800 !important;
  background: linear-gradient(170deg, #0d0a00 0%, #110e04 100%);
}
.op-box::before { background: linear-gradient(90deg,transparent,#ffaa00,transparent) !important; }

.op-header {
  display: flex; justify-content: space-between; align-items: flex-start;
  padding-bottom: 14px; margin-bottom: 14px;
  border-bottom: 1px solid rgba(255,170,0,0.2);
}
.op-title { font-family:'Orbitron',sans-serif; font-size:1rem; color:#ffaa00; letter-spacing:4px; font-weight:700; }
.op-sub   { font-size:0.62rem; color:#775533; margin-top:3px; }
.op-stat-bar { display:flex; gap:12px; font-size:0.65rem; color:#886622; flex-wrap:wrap; justify-content:flex-end; }

/* Tabs */
.op-tabs { display:flex; gap:3px; flex-wrap:wrap; margin-bottom:14px; }
.op-tab {
  font-family:'Orbitron',sans-serif; font-size:0.52rem; letter-spacing:1.5px; padding:6px 11px;
  border:1px solid rgba(255,170,0,0.25); background:rgba(255,170,0,0.03); color:#775522;
  cursor:pointer; transition:all 0.15s; white-space:nowrap;
}
.op-tab:hover { border-color:#ffaa00; color:#ffcc66; background:rgba(255,170,0,0.07); }
.op-tab.active { border-color:#ffaa00; color:#ffdd88; background:rgba(255,170,0,0.13); }
.op-danger-tab { border-color:rgba(255,50,0,0.3)!important; color:#773322!important; }
.op-danger-tab:hover, .op-danger-tab.active { border-color:#ff4400!important; color:#ff8866!important; background:rgba(180,40,0,0.1)!important; }

/* Section */
.op-section { animation:opFade 0.12s ease; }
@keyframes opFade { from{opacity:0;transform:translateY(3px)} to{opacity:1;transform:translateY(0)} }
.op-shead { font-family:'Orbitron',sans-serif; font-size:0.58rem; letter-spacing:2px; color:#ffaa00; text-transform:uppercase; margin:0 0 8px; }
.op-divider { border:none; border-top:1px solid rgba(255,170,0,0.12); margin:14px 0; }
.op-desc { font-size:0.65rem; color:#775533; margin-bottom:8px; line-height:1.5; }
.op-status { font-family:'VT323',monospace; font-size:0.9rem; color:#ffaa00; margin-top:6px; }

/* Form */
.op-input {
  width:100%; background:rgba(0,0,0,0.45); border:1px solid rgba(255,170,0,0.2);
  color:#ffdd88; font-family:'Share Tech Mono',monospace; font-size:0.78rem;
  padding:6px 9px; outline:none; box-sizing:border-box; transition:border-color 0.15s;
}
.op-input:focus { border-color:#ffaa00; }
.op-textarea { min-height:64px; resize:vertical; margin-bottom:8px; }
.op-grid2 { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-bottom:8px; }
.op-grid3 { display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin-bottom:8px; }
.op-field { display:flex; flex-direction:column; gap:3px; }
.op-field label { font-size:0.58rem; color:#886622; text-transform:uppercase; letter-spacing:1px; }
.op-row { display:flex; gap:8px; margin-bottom:8px; flex-wrap:wrap; }

/* Buttons */
.op-btn {
  font-family:'Orbitron',sans-serif; font-size:0.54rem; letter-spacing:1.5px; padding:8px 14px;
  border:1px solid rgba(255,170,0,0.45); background:rgba(180,100,0,0.12); color:#ffcc77;
  cursor:pointer; transition:all 0.15s; white-space:nowrap;
}
.op-btn:hover { background:rgba(180,100,0,0.26); border-color:#ffaa00; }
.op-danger-btn { border-color:rgba(255,80,0,0.45)!important; color:#ff8855!important; background:rgba(180,40,0,0.1)!important; }
.op-danger-btn:hover { background:rgba(180,40,0,0.25)!important; border-color:#ff6600!important; }

/* Player table */
.op-table { width:100%; border-collapse:collapse; font-size:0.72rem; }
.op-table thead th { text-align:left; padding:7px 10px; font-size:0.58rem; letter-spacing:1px; text-transform:uppercase; color:#665533; border-bottom:1px solid rgba(255,170,0,0.15); }
.op-table tbody tr { border-bottom:1px solid rgba(255,170,0,0.06); transition:background 0.1s; }
.op-table tbody tr:hover { background:rgba(255,170,0,0.04); }
.op-table td { padding:7px 10px; }
.op-row-btn { font-family:'Orbitron',sans-serif; font-size:0.5rem; padding:3px 8px; border:1px solid rgba(255,170,0,0.3); background:rgba(255,170,0,0.05); color:#aa8844; cursor:pointer; transition:all 0.12s; margin-right:3px; }
.op-row-btn:hover { border-color:#ffaa00; color:#ffdd88; }
.op-row-btn.danger { border-color:rgba(255,80,0,0.35); color:#ff8855; }
.op-row-btn.danger:hover { border-color:#ff6600; background:rgba(180,40,0,0.12); }

/* Info card */
.op-info-card { background:rgba(255,170,0,0.05); border:1px solid rgba(255,170,0,0.18); padding:8px 10px; margin-bottom:10px; font-size:0.7rem; display:flex; flex-wrap:wrap; gap:10px; color:#aa8844; }

/* Event grid */
.op-event-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:7px; margin-bottom:8px; }
.op-event-card { background:rgba(255,170,0,0.05); border:1px solid rgba(255,170,0,0.2); padding:10px 8px; cursor:pointer; transition:all 0.15s; text-align:center; }
.op-event-card:hover { background:rgba(255,170,0,0.12); border-color:#ffaa00; }
.op-danger-event { border-color:rgba(255,80,0,0.3)!important; }
.op-danger-event:hover { background:rgba(180,40,0,0.2)!important; border-color:#ff6600!important; }
.op-ev-icon { font-size:1.3rem; margin-bottom:3px; }
.op-ev-name { font-family:'Orbitron',sans-serif; font-size:0.52rem; color:#ffcc77; letter-spacing:1px; }
.op-ev-sub  { font-size:0.55rem; color:#665533; margin-top:2px; }

/* Presets */
.op-preset-grid { display:grid; grid-template-columns:1fr 1fr; gap:5px; margin-bottom:8px; }
.op-preset { font-family:'Orbitron',sans-serif; font-size:0.5rem; letter-spacing:1px; padding:7px 9px; border:1px solid rgba(255,170,0,0.18); background:rgba(255,170,0,0.03); color:#775522; cursor:pointer; transition:all 0.15s; text-align:left; }
.op-preset:hover { background:rgba(255,170,0,0.09); color:#ffcc66; border-color:rgba(255,170,0,0.45); }

/* Infobox */
.op-infobox { background:rgba(0,0,0,0.3); border:1px solid rgba(255,170,0,0.1); padding:10px 12px; font-size:0.7rem; color:#886622; line-height:1.8; }

/* Danger cards */
.op-danger-card { background:rgba(180,0,0,0.07); border:1px solid rgba(180,40,0,0.32); padding:12px 14px; margin-bottom:10px; }
.op-dc-title { font-family:'Orbitron',sans-serif; font-size:0.62rem; color:#ff6644; letter-spacing:1px; margin-bottom:3px; }
.op-dc-sub   { font-size:0.63rem; color:#884444; margin-bottom:8px; line-height:1.5; }
.op-danger-full { width:100%; padding:8px; font-family:'Orbitron',sans-serif; font-size:0.56rem; letter-spacing:2px; border:1px solid rgba(255,80,0,0.45); background:rgba(180,30,0,0.14); color:#ff8866; cursor:pointer; transition:all 0.15s; }
.op-danger-full:hover { background:rgba(180,30,0,0.28); border-color:#ff4400; }