/* Plugins > Raid Bases, refreshed 2026-10-11 to the newer plugin-page style (Walkers, Legendary): full-bleed hero that
   fades into the page, statement cards, tier tiles, price cards, and the abandoned-base purge timers by rank. */
.rb { --rb-page: #05070d; --rb-gold: #e6c84a; --rb-gold-hi: #ffe08a; --rb-overlap: clamp(110px, 11vw, 180px);
  --t-easy: #6fcf7a; --t-medium: #d9c14c; --t-hard: #e0645c; --t-expert: #5b9fe0; --t-nightmare: #a874d1; --t-player: #ff7ac8; --t-admin: #9ff0f0; }

/* ---------- hero ---------- */
.rb-hero { position: relative; overflow: hidden; background: radial-gradient(60rem 30rem at 75% 40%, rgba(230, 200, 74, 0.10), transparent 70%), var(--rb-page); }
.rb-hero-art { position: absolute; inset: 0; }
.rb-hero-art img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; display: block; }
.rb-hero-art::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5, 7, 13, 0.95) 0%, rgba(5, 7, 13, 0.86) 28%, rgba(5, 7, 13, 0.3) 55%, rgba(5, 7, 13, 0) 75%), linear-gradient(0deg, var(--rb-page) 0%, rgba(5, 7, 13, 0.92) 14%, rgba(5, 7, 13, 0.55) 30%, rgba(5, 7, 13, 0.18) 46%, rgba(5, 7, 13, 0) 60%); }
.rb-hero .container { position: relative; z-index: 2; }
.rb-hero-inner { min-height: clamp(460px, 44vw, 660px); display: flex; align-items: center; padding: 2rem 0 calc(var(--rb-overlap) + 1.25rem); }
.rb-hero-text { max-width: 36rem; }
.rb-hero .rk-title { font-size: clamp(2.8rem, 7vw, 5rem); letter-spacing: 0.02em; text-shadow: 0 0 40px rgba(230, 200, 74, 0.2); }
.rb-hero .rk-tagline { font-size: clamp(1.05rem, 2.2vw, 1.3rem); }
.rb-chips { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1.3rem; }
.rb-chips span { display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.42rem 0.85rem; border-radius: 999px; background: rgba(0, 0, 0, 0.45); border: 1px solid rgba(230, 200, 74, 0.4); font-size: 0.9rem; font-weight: 600; backdrop-filter: blur(4px); }
.rb-chips svg { width: 16px; height: 16px; color: var(--rb-gold); }
.rb-body { position: relative; z-index: 3; margin-top: calc(-1 * var(--rb-overlap)); }
.rb-body > .rk-section:first-of-type .rk-section-head h2 { text-shadow: 0 2px 12px rgba(0, 0, 0, 0.8); }
@media (max-width: 760px) {
  .rb { --rb-overlap: 1rem; }
  .rb-hero-art { position: relative; height: 240px; }
  .rb-hero-art img { object-position: 72% 40%; }
  .rb-hero-art::after { background: linear-gradient(0deg, var(--rb-page) 0%, rgba(5, 7, 13, 0.6) 25%, rgba(5, 7, 13, 0) 60%); }
  .rb-hero-inner { min-height: 0; padding: 0 0 calc(var(--rb-overlap) + 1rem); margin-top: -0.8rem; }
}

/* ---------- statement card: the key fact under a heading ---------- */
.rb-lead { margin: -0.2rem 0 1.1rem; padding: 0.95rem 1.2rem; border-radius: 14px; background: linear-gradient(90deg, rgba(230, 200, 74, 0.13), rgba(230, 200, 74, 0.03) 70%); border: 1px solid rgba(230, 200, 74, 0.28); border-left: 4px solid var(--rb-gold); font-size: clamp(1.06rem, 2.2vw, 1.22rem); font-weight: 600; line-height: 1.45; color: #f1f3f8; }
.rb-lead a { color: var(--rb-gold-hi); text-decoration: underline; text-decoration-color: rgba(255, 224, 138, 0.5); text-underline-offset: 3px; }
.rb-small { margin: 0.8rem 0 0; font-size: 0.88rem; color: var(--muted, #b7becf); }
.rb-intro { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0 0 1.6rem; }
.rb-intro a, .rb-intro span { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.6rem 0.9rem; border-radius: 12px; background: #151821; border: 1px solid #2c3040; color: inherit; text-decoration: none; font-size: 0.92rem; font-weight: 600; }
.rb-intro a:hover, .rb-intro a:focus-visible { border-color: rgba(230, 200, 74, 0.5); }
.rb-intro svg { width: 18px; height: 18px; color: var(--rb-gold); flex: 0 0 auto; }

/* ---------- tier tiles ---------- */
.rb-tiers { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.8rem; }
.rb-tier { position: relative; padding: 1rem 1rem 1.05rem; border-radius: 14px; background: linear-gradient(180deg, #1b1e28, #12141b); border: 1px solid #2c3040; border-top: 3px solid var(--c); overflow: hidden; transition: transform 0.15s ease, border-color 0.2s ease; }
.rb-tier:hover { transform: translateY(-2px); border-color: color-mix(in srgb, var(--c) 55%, #2c3040); border-top-color: var(--c); }
.rb-tier::after { content: ""; position: absolute; right: -40px; top: -40px; width: 120px; height: 120px; border-radius: 50%; background: radial-gradient(circle, color-mix(in srgb, var(--c) 22%, transparent), transparent 70%); pointer-events: none; }
.rb-tier-h { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; }
.rb-tier b { font-family: "Cinzel", serif; font-size: 1.12rem; color: var(--c); }
.rb-mode { padding: 0.12rem 0.5rem; border-radius: 6px; font-size: 0.7rem; font-weight: 800; letter-spacing: 0.08em; }
.rb-mode.is-pve { color: #c9ffe0; background: rgba(125, 255, 176, 0.1); border: 1px solid rgba(125, 255, 176, 0.35); }
.rb-mode.is-pvp { color: #ffd2cb; background: rgba(255, 110, 90, 0.12); border: 1px solid rgba(255, 110, 90, 0.4); }
.rb-tier p { margin: 0.55rem 0 0; font-size: 0.9rem; line-height: 1.45; color: var(--muted, #b7becf); }
@media (max-width: 900px) { .rb-tiers { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rb-tier:last-child:nth-child(odd) { grid-column: 1 / -1; } }
@media (max-width: 420px) { .rb-tiers { grid-template-columns: minmax(0, 1fr); } }

/* when tiers unlock in a fresh wipe */
.rb-unlock { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; margin-top: 1rem; }
.rb-day { padding: 0.9rem 1rem; border-radius: 14px; background: #151821; border: 1px solid #2c3040; }
.rb-day small { display: block; font-size: 0.75rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted, #b7becf); }
.rb-day strong { display: block; margin: 0.15rem 0 0.45rem; font-family: "Cinzel", serif; font-size: 1.25rem; color: var(--rb-gold-hi); }
.rb-day span { display: inline-block; margin: 0 0.3rem 0.3rem 0; padding: 0.15rem 0.55rem; border-radius: 999px; font-size: 0.82rem; font-weight: 700; color: var(--c); background: color-mix(in srgb, var(--c) 12%, transparent); border: 1px solid color-mix(in srgb, var(--c) 40%, transparent); }
@media (max-width: 640px) { .rb-unlock { grid-template-columns: minmax(0, 1fr); } }

/* ---------- three-up fact tiles ---------- */
.rb-facts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.8rem; }
.rb-fact { padding: 1.1rem 1.1rem 1.15rem; border-radius: 14px; background: linear-gradient(180deg, #1b1e28, #12141b); border: 1px solid #2c3040; }
.rb-fact svg { width: 30px; height: 30px; color: var(--c, var(--rb-gold)); }
.rb-fact h3 { margin: 0.5rem 0 0.3rem; font-size: 1.05rem; }
.rb-fact p { margin: 0; font-size: 0.92rem; line-height: 1.5; color: var(--muted, #b7becf); }
.rb-facts.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 760px) { .rb-facts, .rb-facts.is-two { grid-template-columns: minmax(0, 1fr); } }

/* ---------- loot share needed, per tier ---------- */
.rb-share { display: grid; gap: 0.6rem; padding: 1.1rem 1.2rem; border-radius: 14px; background: #10131a; border: 1px solid #2c3040; }
.rb-share-row { display: grid; grid-template-columns: minmax(0, 9.5rem) minmax(0, 1fr) 4.5rem; gap: 0.8rem; align-items: center; }
.rb-share-row b { font-weight: 700; color: var(--c); }
.rb-share-bar { height: 12px; border-radius: 999px; background: #232837; overflow: hidden; }
.rb-share-bar i { display: block; height: 100%; width: var(--w); border-radius: 999px; background: linear-gradient(90deg, color-mix(in srgb, var(--c) 60%, #fff 0%), var(--c)); box-shadow: 0 0 10px color-mix(in srgb, var(--c) 55%, transparent); }
.rb-share-row span { text-align: right; font-weight: 800; font-size: 0.95rem; }
@media (max-width: 480px) { .rb-share-row { grid-template-columns: minmax(0, 1fr) 4rem; } .rb-share-bar { grid-column: 1 / -1; grid-row: 2; } }

/* ---------- /buyraid price cards ---------- */
/* five buyable tiers (2026-10-11): one row on desktop, 3 + 2, then pairs with the last card full width */
.rb-prices { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0.7rem; }
.rb-price { padding: 0.95rem 0.8rem 1rem; border-radius: 14px; background: linear-gradient(180deg, #1b1e28, #12141b); border: 1px solid #2c3040; border-top: 3px solid var(--c); text-align: center; }
.rb-price b { display: block; font-family: "Cinzel", serif; font-size: 1.02rem; color: var(--c); }
.rb-price strong { display: block; margin: 0.45rem 0 0.1rem; font: 800 1.3rem/1.1 "Inter", system-ui, sans-serif; color: #f1f3f8; }
.rb-price small { display: block; font-size: 0.78rem; font-weight: 700; letter-spacing: 0.08em; color: var(--muted, #b7becf); }
.rb-price em { display: inline-block; margin-top: 0.55rem; padding: 0.18rem 0.55rem; border-radius: 999px; font-style: normal; font-size: 0.82rem; font-weight: 700; color: #d6dbe7; background: rgba(255, 255, 255, 0.05); border: 1px solid #3a4054; }
@media (max-width: 1000px) { .rb-prices { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 480px) { .rb-prices { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rb-price:last-child:nth-child(odd) { grid-column: 1 / -1; } }

/* ---------- player raid bases: two columns ---------- */
.rb-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 1rem; }
.rb-panel { padding: 1.2rem 1.2rem 1.25rem; border-radius: 16px; background: #10131a; border: 1px solid #2c3040; }
.rb-panel > h3 { display: flex; align-items: center; gap: 0.6rem; margin: 0 0 0.8rem; font-family: "Cinzel", serif; font-size: 1.2rem; }
.rb-panel > h3 svg { width: 24px; height: 24px; color: var(--t-player); }
.rb-panel ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 0.55rem; }
.rb-panel li { position: relative; padding-left: 1.3rem; line-height: 1.5; font-size: 0.95rem; color: #d6dbe7; }
.rb-panel li::before { content: ""; position: absolute; left: 0.15rem; top: 0.6em; width: 7px; height: 7px; border-radius: 50%; background: var(--t-player); }
@media (max-width: 860px) { .rb-split { grid-template-columns: minmax(0, 1fr); } }

/* ---------- purge timers: rank rows x server cycle, day chips ---------- */
.rb-purge { margin-top: 1.2rem; border-radius: 16px; background: #10131a; border: 1px solid #2c3040; overflow: hidden; }
.rb-purge-head, .rb-purge-row { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); gap: 0.8rem; align-items: center; padding: 0.85rem 1.1rem; }
.rb-purge-head { background: rgba(230, 200, 74, 0.07); border-bottom: 1px solid rgba(230, 200, 74, 0.25); font-size: 0.82rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--rb-gold-hi); }
.rb-purge-head span small { display: block; text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--muted, #b7becf); font-size: 0.8rem; }
.rb-purge-row + .rb-purge-row { border-top: 1px solid #232837; }
.rb-rank { display: flex; align-items: center; gap: 0.75rem; min-width: 0; }
.rb-rank svg { width: 38px; height: 42px; flex: 0 0 auto; filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.5)); }
.rb-rank b { display: block; color: var(--c); font-size: 1rem; }
.rb-rank small { display: block; color: var(--muted, #b7becf); font-size: 0.8rem; line-height: 1.35; }
.rb-days { display: flex; align-items: center; gap: 0.6rem; }
.rb-chip { display: inline-flex; align-items: baseline; gap: 0.3rem; min-width: 4.4rem; justify-content: center; padding: 0.35rem 0.7rem; border-radius: 10px; background: color-mix(in srgb, var(--c) 14%, #151821); border: 1px solid color-mix(in srgb, var(--c) 45%, transparent); }
.rb-chip strong { font: 800 1.35rem/1 "Inter", system-ui, sans-serif; color: #f1f3f8; }
.rb-chip small { font-size: 0.78rem; font-weight: 700; color: var(--muted, #b7becf); }
.rb-dbar { flex: 1 1 auto; height: 6px; border-radius: 999px; background: #232837; overflow: hidden; }
.rb-dbar i { display: block; height: 100%; width: calc(var(--d) * 10%); background: var(--c); border-radius: 999px; }
.rb-mlabel { display: none; }
@media (max-width: 640px) {
  .rb-purge-head { display: none; }
  .rb-purge-row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .rb-rank { grid-column: 1 / -1; }
  .rb-days { flex-direction: column; align-items: flex-start; gap: 0.3rem; }
  .rb-mlabel { display: block; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; color: var(--muted, #b7becf); }
  .rb-dbar { width: 100%; flex: none; }
}

@media (prefers-reduced-motion: reduce) { .rb-tier { transition: none; } .rb-tier:hover { transform: none; } }

/* sub-heading inside a section */
.rb-h3 { margin: 1.4rem 0 0.7rem; font-size: 1.05rem; font-weight: 700; color: #f1f3f8; }

