/* GENERATO da scripts/season_halloween_css.py partendo da public/css/iw2-theme.css.
   NON modificare a mano: si cambia l'originale e si rilancia lo script. */
/* ============================================================
   IMPERIAWORLD 2 — REDESIGN V2 (tenant imperiaworld2 only)
   Metin2 fantasy soul · Lonvel layout · ice-blue + gold
   Scoped: body.theme-iw2 (frontend) / body.theme-iw2-shop (shop)
   Zenthara NON usa questo file.
   ============================================================ */

body.theme-iw2 {
  --iw2-accent: #b14aff;
  --iw2-accent-bright: #ce8fff;
  --iw2-accent-soft: rgba(177, 74, 255, 0.12);
  --iw2-accent-line: rgba(177, 74, 255, 0.4);
  --iw2-gold: #f59342;
  --iw2-gold-bright: #fac89f;
  --iw2-gold-line: rgba(245, 147, 66, 0.4);
  --iw2-glow: 0.7;

  --iw2-bg: #100616;
  --iw2-bg-panel: linear-gradient(160deg, #1d0d27 0%, #15081c 100%);
  --iw2-line: rgba(165, 120, 200, 0.16);
  --iw2-ink: #f4eef8;
  --iw2-ink-dim: #c6b4d4;
  --iw2-ink-faint: #877098;

  --iw2-display: 'Cinzel', serif;
  --iw2-body: 'Alegreya Sans', sans-serif;
}

/* ---------- base ---------- */
body.theme-iw2 {
  background-color: var(--iw2-bg) !important;
  background-image: none !important;
  color: var(--iw2-ink) !important;
  font-family: var(--iw2-body);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.theme-iw2::before {
  /* sostituisce il dark overlay dell'app layout: ambient glow v2 */
  content: '';
  position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(ellipse 70% 45% at 50% -5%, rgba(74, 163, 255, calc(0.13 * var(--iw2-glow))) 0%, transparent 60%),
    radial-gradient(ellipse 40% 30% at 85% 15%, rgba(245, 147, 66, 0.05) 0%, transparent 70%) !important;
}
body.theme-iw2 ::selection { background: var(--iw2-accent); color: #ffffff; }
body.theme-iw2::-webkit-scrollbar { width: 11px; }
body.theme-iw2::-webkit-scrollbar-track { background: #0c0214; }
body.theme-iw2::-webkit-scrollbar-thumb {
  background: linear-gradient(180deg, #3f234f, #2b1538);
  border-radius: 6px; border: 2px solid #0c0214;
}
body.theme-iw2::-webkit-scrollbar-thumb:hover { background: #502b65; }
body.theme-iw2 :focus-visible { outline: 2px solid var(--iw2-accent-line); outline-offset: 2px; border-radius: 4px; }

body.theme-iw2 h1, body.theme-iw2 h2, body.theme-iw2 h3, body.theme-iw2 h4,
body.theme-iw2 .font-cinzel {
  font-family: var(--iw2-display) !important;
}

/* ---------- floating embers (ice sparks) ---------- */
.iw2-ember {
  position: fixed; bottom: -10px; border-radius: 50%;
  background: var(--iw2-accent-bright);
  pointer-events: none; z-index: 0;
  opacity: 0;
  animation: iw2EmberRise linear infinite;
}
@keyframes iw2EmberRise {
  0% { transform: translateY(0) translateX(0); opacity: 0; }
  12% { opacity: calc(0.55 * var(--iw2-glow, 0.7)); }
  85% { opacity: calc(0.25 * var(--iw2-glow, 0.7)); }
  100% { transform: translateY(-105vh) translateX(40px); opacity: 0; }
}
@media (prefers-reduced-motion: reduce) { .iw2-ember { display: none; } }

/* ============================================================
   NAV (restyle del markup esistente navigation.blade.php)
   ============================================================ */
body.theme-iw2 div[x-data*="isOpen"][style*="linear-gradient(180deg, rgba(15,10,5,0.98)"] {
  background: rgba(12, 2, 20, 0.96) !important;
  border-bottom: 1px solid var(--iw2-line) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  position: sticky !important; top: 0; z-index: 100 !important;
  box-shadow: 0 1px 0 rgba(245, 147, 66, 0.18);
}
body.theme-iw2 .nav a, body.theme-iw2 .nav button {
  font-family: var(--iw2-display) !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.07em !important;
  text-transform: uppercase !important;
  color: #e2d6eb !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  transition: color 0.18s, background 0.18s, border-color 0.18s !important;
}
body.theme-iw2 .nav a span, body.theme-iw2 .nav button span {
  color: inherit !important;
  font-size: 0.78rem !important;
  text-shadow: none !important;
  font-family: inherit !important;
}
body.theme-iw2 .nav a svg, body.theme-iw2 .nav a i { color: currentColor !important; opacity: 0.75; }
body.theme-iw2 .nav a:hover {
  color: var(--iw2-gold-bright) !important;
  background-color: rgba(245, 147, 66, 0.06) !important;
  border-color: var(--iw2-gold-line) !important;
}
/* Active page link (legacy active = shadow 0_0_15px/0.4) → box blu freddo (niente oro/marrone nel menu) */
body.theme-iw2 .nav a.bg-gradient-to-r {
  color: var(--iw2-accent-bright) !important;
  background-color: rgba(177, 74, 255, 0.12) !important;
  border-color: var(--iw2-accent-line) !important;
}
body.theme-iw2 .nav a.bg-gradient-to-r svg, body.theme-iw2 .nav a.bg-gradient-to-r i { color: var(--iw2-accent-bright) !important; opacity: 1; }
/* Download GAME button ONLY (classe unica shadow-[0_0_20px_rgba(201,169,110,0.3)]) → btn-primary BLU
   (il gradiente oro scuro risultava marrone e stonava col tema freddo). */
body.theme-iw2 .nav a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] {
  background-image: linear-gradient(160deg, #8d13ea 0%, #6c0fb3 55%, #530b8b 100%) !important;
  background-color: transparent !important;
  color: #f2f8ff !important;
  border: 1px solid rgba(206, 143, 255, 0.55) !important;
  box-shadow: 0 0 calc(28px * var(--iw2-glow)) rgba(177, 74, 255, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  text-shadow: 0 1px 6px rgba(34, 0, 60, 0.6) !important;
}
body.theme-iw2 .nav a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] svg,
body.theme-iw2 .nav a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] span { color: #f2f8ff !important; opacity: 1; }
body.theme-iw2 .nav a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"]:hover { filter: brightness(1.12); }
/* language chip */
body.theme-iw2 .nav button[class*="bg-[#1a1408]"] {
  background: rgba(11, 1, 18, 0.4) !important;
  border: 1px solid var(--iw2-line) !important;
  color: var(--iw2-ink-dim) !important;
  border-radius: 7px !important;
}
body.theme-iw2 .nav button[class*="bg-[#1a1408]"]:hover { border-color: var(--iw2-gold-line) !important; color: var(--iw2-gold-bright) !important; }
/* dropdown lingua / menu mobile container.
   NB: il browser a volte serializza lo style inline in rgb() invece di #hex
   (es. il dropdown lingua diventa rgb(42, 31, 15)). Copro entrambe le forme +
   un fallback per classe (panel dropdown assoluto con shadow-2xl). */
body.theme-iw2 [x-show="open"][style*="linear-gradient(135deg, #2a1f0f"],
body.theme-iw2 [x-show="open"][style*="linear-gradient(135deg, rgb(42, 31, 15)"],
body.theme-iw2 [x-show="open"][style*="linear-gradient(135deg,rgb(42,31,15)"],
body.theme-iw2 [x-show="isOpen"][style*="linear-gradient(135deg, #2a1f0f"],
body.theme-iw2 [x-show="isOpen"][style*="linear-gradient(135deg, rgb(42, 31, 15)"],
body.theme-iw2 [x-show="open"].absolute.shadow-2xl[style*="linear-gradient"],
body.theme-iw2 [x-show="isOpen"][style*="linear-gradient"] {
  background: linear-gradient(160deg, #230f2f 0%, #15081c 100%) !important;
  background-image: linear-gradient(160deg, #230f2f 0%, #15081c 100%) !important;
  border: 1px solid var(--iw2-gold-line) !important;
  border-radius: 9px !important;
  box-shadow: 0 22px 50px -12px rgba(0, 0, 0, 0.85), 0 0 calc(28px * var(--iw2-glow)) rgba(177, 74, 255, 0.08) !important;
}
body.theme-iw2 [x-show="open"] a, body.theme-iw2 [x-show="isOpen"] a {
  color: var(--iw2-ink-dim) !important;
  border-radius: 6px !important;
}
/* dropdown items: default trasparente; hover + attivo BLU (NON oro/marrone).
   NB: [class*="bg-[#78350f]"] e' greedy (matcha hover:bg-[#78350f] di OGNI item)
   -> usavo l'oro su tutti. L'attivo ha la classe bg-[#78350f]/30 (senza hover:). */
body.theme-iw2 [x-show="open"] a { background-color: transparent !important; }
body.theme-iw2 [x-show="open"] a:hover {
  background-color: rgba(177, 74, 255, 0.12) !important;
  color: var(--iw2-accent-bright) !important;
}
body.theme-iw2 [x-show="open"] a[class*="bg-[#78350f]/30"] {
  background-color: rgba(177, 74, 255, 0.16) !important;
  color: var(--iw2-accent-bright) !important;
}
body.theme-iw2 [x-show="open"] a[class*="bg-[#78350f]/30"] svg,
body.theme-iw2 [x-show="open"] a:hover svg { color: var(--iw2-accent-bright) !important; }
/* menu mobile: hover blu freddo (era oro) */
body.theme-iw2 [x-show="isOpen"] a:hover { background: rgba(177, 74, 255, 0.1) !important; color: var(--iw2-accent-bright) !important; }
body.theme-iw2 [x-show="isOpen"] a.bg-gradient-to-r {
  background: var(--iw2-accent-soft) !important;
  border-color: var(--iw2-accent-line) !important;
  color: var(--iw2-accent-bright) !important;
}
body.theme-iw2 [x-show="isOpen"] a.bg-gradient-to-r svg,
body.theme-iw2 [x-show="isOpen"] a.bg-gradient-to-r i { color: var(--iw2-accent-bright) !important; }
/* menu mobile: il container nav ha [&_span]:text-[#c9a96e] che colora TUTTI gli
   span di oro/tan (#c9a96e=rgb(201,169,110)). I miei .nav a span coprono solo il
   desktop. Qui forzo testo + icone + bordi del menu mobile al blu/azzurro v2. */
body.theme-iw2 [x-show="isOpen"] span,
body.theme-iw2 [x-show="isOpen"] a,
body.theme-iw2 [x-show="isOpen"] button { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 [x-show="isOpen"] a svg, body.theme-iw2 [x-show="isOpen"] a i,
body.theme-iw2 [x-show="isOpen"] button svg { color: var(--iw2-ink-faint) !important; }
/* link/elementi mobile con bordo oro -> linea v2 */
body.theme-iw2 [x-show="isOpen"] a,
body.theme-iw2 [x-show="isOpen"] button,
body.theme-iw2 [x-show="isOpen"] [class*="border-[#c9a96e]"],
body.theme-iw2 [x-show="isOpen"] [style*="rgba(201, 169, 110"],
body.theme-iw2 [x-show="isOpen"] [style*="rgb(201, 169, 110)"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [x-show="isOpen"] [style*="rgb(201, 169, 110)"]:not([style*="border"]) { color: var(--iw2-ink-dim) !important; }
/* attivo/hover/download: span azzurro brillante (sovrascrive il default sopra) */
body.theme-iw2 [x-show="isOpen"] a.bg-gradient-to-r span,
body.theme-iw2 [x-show="isOpen"] a.bg-gradient-to-r,
body.theme-iw2 [x-show="isOpen"] a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] span,
body.theme-iw2 [x-show="isOpen"] a:hover span { color: var(--iw2-accent-bright) !important; }
body.theme-iw2 [x-show="isOpen"] a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] span { color: #f2f8ff !important; }
/* bordo del container menu mobile -> linea v2 (era oro) */
body.theme-iw2 div[x-show="isOpen"][class*="2xl:hidden"] { border-color: var(--iw2-line) !important; }
/* menu mobile: bottone Download Game pieno BLU (era ambra) */
body.theme-iw2 [x-show="isOpen"] a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] {
  background-image: linear-gradient(160deg, #8d13ea 0%, #6c0fb3 55%, #530b8b 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  color: #f2f8ff !important;
}
body.theme-iw2 [x-show="isOpen"] a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] svg,
body.theme-iw2 [x-show="isOpen"] a[class*="shadow-[0_0_20px_rgba(201,169,110,0.3)"] span { color: #f2f8ff !important; }
/* server switcher (livewire) */
body.theme-iw2 .nav [class*="server-switcher"] button { border-color: var(--iw2-line) !important; }

/* online chip nel nav */
.iw2-online-chip {
  display: inline-flex; align-items: center; gap: 7px; flex: none;
  font-family: var(--iw2-body); font-size: 12.5px; font-weight: 700;
  color: #7be0a3 !important; letter-spacing: 0.03em;
  border: 1px solid rgba(123, 224, 163, 0.3) !important; border-radius: 999px;
  background: rgba(123, 224, 163, 0.07) !important;
  padding: 6px 12px; white-space: nowrap;
  text-transform: none !important;
}
.iw2-online-chip .iw2-od {
  width: 7px; height: 7px; border-radius: 50%; background: #7be0a3;
  box-shadow: 0 0 calc(10px * var(--iw2-glow, 0.7)) #7be0a3;
  animation: iw2Pulse 2s ease-in-out infinite;
}
.iw2-online-chip .iw2-ok { color: var(--iw2-ink-faint) !important; font-weight: 500; }
@keyframes iw2Pulse { 50% { opacity: 0.3; } }
@media (max-width: 640px) { .iw2-online-chip { display: none; } }

/* ============================================================
   HERO V2 (markup nuovo)
   ============================================================ */
.iw2-hero {
  position: relative; z-index: 1;
  display: flex; align-items: center; justify-content: center;
  text-align: center; overflow: hidden;
  padding: 44px 24px 84px;
  background:
    radial-gradient(ellipse 55% 85% at 50% -10%, rgba(177, 74, 255, 0.1), transparent 65%),
    linear-gradient(180deg, #14091b 0%, #100616 100%);
}
.iw2-hero-content { position: relative; z-index: 2; max-width: 860px; }
.iw2-hero-eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--iw2-display); font-size: 11px; font-weight: 600;
  letter-spacing: 0.4em; text-transform: uppercase; color: var(--iw2-gold-bright);
  border: 1px solid var(--iw2-gold-line); border-radius: 999px;
  background: rgba(16, 6, 22, 0.55); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  padding: 9px 20px 9px 16px;
}
.iw2-hero-eyebrow .iw2-dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--iw2-accent-bright);
  box-shadow: 0 0 calc(12px * var(--iw2-glow)) var(--iw2-accent-bright);
  animation: iw2Pulse 1.8s ease-in-out infinite;
}
/* animated logo */
.iw2-hero-logo { position: relative; margin: 24px auto 2px; max-width: min(440px, 78%); }
.iw2-hero-logo .iw2-logo-aura {
  /* 12-09-2026: inset -22% sporgeva oltre il bordo destro su telefono
     (misurato: 4px di sforo a 390px). L'alone resta identico a vista,
     ma non fa piu' comparire la barra di scorrimento orizzontale. */
  position: absolute; inset: -22%; pointer-events: none; z-index: 0;
  max-width: 100vw;
  background: radial-gradient(ellipse 55% 50% at 50% 52%,
    rgba(177, 74, 255, 0.32) 0%,
    rgba(177, 74, 255, 0.10) 45%,
    transparent 72%);
  filter: blur(6px);
  animation: iw2AuraBreath 4.6s ease-in-out infinite;
  opacity: calc(0.8 * var(--iw2-glow));
}
@keyframes iw2AuraBreath { 50% { transform: scale(1.12); opacity: calc(1.05 * var(--iw2-glow, 0.7)); } }
.iw2-hero-logo img {
  position: relative; z-index: 1;
  width: 100%; height: auto; display: block;
  filter: drop-shadow(0 0 calc(46px * var(--iw2-glow)) rgba(177, 74, 255, 0.45)) drop-shadow(0 14px 40px rgba(0, 0, 0,0.8));
  animation: iw2LogoFloat 6.5s ease-in-out infinite;
}
@keyframes iw2LogoFloat { 50% { transform: translateY(-7px); } }
.iw2-hero-logo .iw2-logo-shine {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  -webkit-mask-image: var(--iw2-logo-url); mask-image: var(--iw2-logo-url);
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  background: linear-gradient(115deg,
    transparent 30%,
    rgba(255, 255, 255, 0.0) 40%,
    rgba(240, 220, 255, 0.55) 50%,
    rgba(206, 143, 255, 0.35) 54%,
    transparent 64%);
  background-size: 280% 100%;
  background-position: 120% 0;
  animation: iw2LogoSheen 5.2s ease-in-out infinite;
  mix-blend-mode: screen;
}
@keyframes iw2LogoSheen {
  0%, 55% { background-position: 120% 0; }
  75%, 100% { background-position: -60% 0; }
}
.iw2-hero-logo .iw2-logo-spark {
  position: absolute; z-index: 3; pointer-events: none;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--iw2-accent-bright);
  box-shadow: 0 0 calc(10px * var(--iw2-glow)) var(--iw2-accent-bright), 0 0 calc(22px * var(--iw2-glow)) var(--iw2-accent);
  opacity: 0;
  animation: iw2SparkRise 3.4s ease-out infinite;
}
@keyframes iw2SparkRise {
  0% { opacity: 0; transform: translateY(6px) scale(0.6); }
  12% { opacity: 1; }
  60% { opacity: 0.7; }
  100% { opacity: 0; transform: translateY(-46px) scale(0.25); }
}
.iw2-hero-logo .iw2-logo-flash {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  -webkit-mask-image: var(--iw2-logo-url); mask-image: var(--iw2-logo-url);
  -webkit-mask-size: contain; mask-size: contain;
  -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat;
  -webkit-mask-position: center; mask-position: center;
  background: var(--iw2-accent-bright);
  mix-blend-mode: screen; opacity: 0;
}
.iw2-hero-logo .iw2-logo-flash.iw2-strike { animation: iw2LogoFlash 0.85s ease-out forwards; }
@keyframes iw2LogoFlash {
  0% { opacity: 0; }
  6% { opacity: 0.5; }
  14% { opacity: 0.1; }
  22% { opacity: 0.38; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .iw2-hero-logo img, .iw2-hero-logo .iw2-logo-aura, .iw2-hero-logo .iw2-logo-spark { animation: none; }
  .iw2-hero-logo .iw2-logo-shine { display: none; }
}
.iw2-hero-tag {
  font-size: clamp(15.5px, 1.8vw, 18px); font-weight: 400;
  color: #dfcfeb; letter-spacing: 0.02em; line-height: 1.55;
  max-width: 480px; margin: 14px auto 0;
  text-shadow: 0 2px 16px rgba(0, 0, 0, 0.9);
  text-wrap: balance;
}
.iw2-hero-tag .iw2-em { color: var(--iw2-gold-bright); font-family: var(--iw2-display); font-weight: 700; font-size: 0.85em; letter-spacing: 0.1em; }
/* Riga di supporto sotto il claim: dice cos'e' il server, in tono minore. */
.iw2-hero-sub {
  font-size: clamp(13.5px, 1.5vw, 15.5px); font-weight: 400;
  color: var(--iw2-ink-dim); letter-spacing: 0.01em; line-height: 1.6;
  max-width: 560px; margin: 9px auto 0;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.9);
  text-wrap: balance;
}
.iw2-hero-ctas { display: flex; gap: 14px; justify-content: center; margin-top: 26px; flex-wrap: wrap; }
.iw2-hero-note { margin-top: 16px; font-size: 13.5px; color: var(--iw2-ink-dim); }
.iw2-hero-note a { color: var(--iw2-accent-bright) !important; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- lightning ---------- */
.iw2-bolt-layer { position: absolute; inset: 0; pointer-events: none; overflow: hidden; z-index: 1; }
.iw2-bolt {
  position: absolute; top: 0;
  width: 190px; height: 78%;
  opacity: 0;
}
.iw2-bolt svg { width: 100%; height: 100%; display: block; }
.iw2-bolt path {
  fill: none; stroke: var(--iw2-accent-bright); stroke-width: 2.6;
  stroke-linejoin: round; stroke-linecap: round;
  filter: drop-shadow(0 0 calc(7px * var(--iw2-glow)) var(--iw2-accent-bright))
          drop-shadow(0 0 calc(20px * var(--iw2-glow)) var(--iw2-accent));
}
.iw2-bolt path.iw2-branch { stroke-width: 1.4; opacity: 0.8; }
.iw2-bolt.iw2-strike { animation: iw2BoltFlash 0.85s ease-out forwards; }
@keyframes iw2BoltFlash {
  0% { opacity: 0; }
  6% { opacity: 1; }
  14% { opacity: 0.25; }
  22% { opacity: 0.95; }
  36% { opacity: 0.12; }
  48% { opacity: 0.5; }
  100% { opacity: 0; }
}
.iw2-sky-flash {
  position: absolute; inset: 0; pointer-events: none; opacity: 0; z-index: 0;
  background: radial-gradient(ellipse 60% 55% at var(--iw2-fx, 50%) 0%,
    rgba(206, 143, 255, 0.26) 0%,
    rgba(177, 74, 255, 0.10) 45%,
    transparent 75%);
}
.iw2-sky-flash.iw2-strike { animation: iw2SkyFlash 0.85s ease-out forwards; }
@keyframes iw2SkyFlash {
  0% { opacity: 0; }
  6% { opacity: 1; }
  16% { opacity: 0.2; }
  24% { opacity: 0.8; }
  100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .iw2-bolt.iw2-strike, .iw2-sky-flash.iw2-strike { animation: none; opacity: 0; }
}

/* ---------- countdown bar ---------- */
.iw2-count-bar {
  position: relative; z-index: 3;
  margin: -54px auto 0; max-width: 740px;
  display: flex; align-items: center; justify-content: space-between; gap: 24px;
  background: linear-gradient(160deg, rgba(34, 14, 46, 0.94), rgba(21, 8, 28, 0.96));
  border: 1px solid var(--iw2-gold-line); border-radius: 12px;
  padding: 18px 28px;
  box-shadow: 0 26px 60px -18px rgba(0, 0, 0, 0.85), 0 0 calc(40px * var(--iw2-glow)) rgba(177, 74, 255, 0.12);
  -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
}
.iw2-count-info .iw2-t {
  font-family: var(--iw2-display); font-weight: 700; font-size: 14px;
  letter-spacing: 0.18em; text-transform: uppercase; color: var(--iw2-gold-bright);
}
.iw2-count-info .iw2-d { font-size: 13.5px; color: var(--iw2-ink-dim); margin-top: 3px; letter-spacing: 0.04em; }
.iw2-count-cells { display: flex; gap: 16px; align-items: center; }
.iw2-count-cell { text-align: center; min-width: 52px; }
.iw2-count-num {
  font-family: var(--iw2-display); font-weight: 700; font-size: 30px; line-height: 1;
  color: var(--iw2-accent-bright);
  text-shadow: 0 0 calc(22px * var(--iw2-glow)) rgba(177, 74, 255, 0.65);
  font-variant-numeric: tabular-nums;
}
.iw2-count-unit { font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--iw2-ink-faint); margin-top: 6px; }
.iw2-count-sep { font-family: var(--iw2-display); font-size: 24px; color: var(--iw2-ink-faint); padding-bottom: 14px; }
@media (max-width: 1080px) {
  .iw2-count-bar { flex-direction: column; gap: 14px; text-align: center; margin-top: -40px; }
}
@media (max-width: 640px) {
  .iw2-count-cells { gap: 10px; }
  .iw2-count-cell { min-width: 44px; }
}

/* ---------- buttons v2 ---------- */
.iw2-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  font-family: var(--iw2-display) !important; font-weight: 700; font-size: 13px;
  letter-spacing: 0.2em; text-transform: uppercase;
  text-decoration: none; cursor: pointer;
  border-radius: 6px; padding: 14px 28px;
  position: relative; overflow: hidden;
  transition: transform 0.2s, box-shadow 0.25s, filter 0.2s;
  white-space: nowrap; border: 1px solid transparent;
}
.iw2-btn:active { transform: translateY(1px); }
.iw2-btn-primary {
  background: linear-gradient(160deg, #8d13ea 0%, #6c0fb3 55%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  box-shadow: 0 0 calc(34px * var(--iw2-glow, 0.7)) rgba(177, 74, 255, 0.4),
              inset 0 1px 0 rgba(255, 255, 255, 0.25) !important;
  text-shadow: 0 1px 6px rgba(34, 0, 60, 0.6);
}
.iw2-btn-primary:hover { filter: brightness(1.12); box-shadow: 0 0 calc(50px * var(--iw2-glow, 0.7)) rgba(177, 74, 255, 0.55), inset 0 1px 0 rgba(255, 255, 255,0.3) !important; transform: translateY(-1px); }
/* CTA secondario (hero DOWNLOAD CLIENT): ghost blu freddo invece dell'oro-marrone */
.iw2-btn-gold {
  background: rgba(177, 74, 255, 0.06) !important;
  color: var(--iw2-accent-bright) !important;
  border-color: var(--iw2-accent-line) !important;
  box-shadow: inset 0 1px 0 rgba(206, 143, 255, 0.15) !important;
}
.iw2-btn-gold:hover { background: rgba(177, 74, 255, 0.12) !important; border-color: rgba(206, 143, 255, 0.7) !important; transform: translateY(-1px); }
.iw2-btn .iw2-sheen {
  position: absolute; top: 0; bottom: 0; width: 40%;
  left: -60%; transform: skewX(-20deg);
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255,0.18), transparent);
  animation: iw2Sheen 3.8s ease-in-out infinite;
}
@keyframes iw2Sheen { 0%, 60% { left: -60%; } 100% { left: 130%; } }
@media (prefers-reduced-motion: reduce) { .iw2-btn .iw2-sheen { animation: none; } }
@media (max-width: 640px) { .iw2-hero-ctas .iw2-btn { width: 100%; } }

/* ============================================================
   PANEL V2 (nuovi componenti features / steps / panel generico)
   ============================================================ */
.iw2-panel {
  position: relative;
  background: var(--iw2-bg-panel);
  border: 1px solid var(--iw2-line);
  border-radius: 10px;
}
.iw2-panel::before, .iw2-panel::after {
  content: ""; position: absolute; width: 14px; height: 14px; pointer-events: none;
  border-color: var(--iw2-gold-line); border-style: solid;
}
.iw2-panel::before { top: -1px; left: -1px; border-width: 1.5px 0 0 1.5px; border-radius: 10px 0 0 0; }
.iw2-panel::after { bottom: -1px; right: -1px; border-width: 0 1.5px 1.5px 0; border-radius: 0 0 10px 0; }
.iw2-panel-head {
  display: flex; align-items: center; gap: 10px;
  padding: 14px 18px 12px;
  border-bottom: 1px solid var(--iw2-line);
}
.iw2-panel-head .iw2-rune {
  width: 8px; height: 8px; transform: rotate(45deg); flex: none;
  background: linear-gradient(135deg, var(--iw2-gold-bright), var(--iw2-gold));
  box-shadow: 0 0 calc(10px * var(--iw2-glow)) rgba(245, 147, 66, 0.6);
}
.iw2-panel-title {
  font-family: var(--iw2-display) !important; font-weight: 700; font-size: 14px;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--iw2-gold-bright) !important;
  margin: 0;
}

/* ---------- server features ---------- */
.iw2-features-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.iw2-feature {
  display: flex; gap: 13px; align-items: flex-start;
  padding: 15px 18px;
  border-bottom: 1px solid rgba(165, 120, 200, 0.08);
}
.iw2-feature:nth-child(odd) { border-right: 1px solid rgba(165, 120, 200, 0.08); }
.iw2-feature:nth-last-child(-n+2) { border-bottom: none; }
.iw2-feature .iw2-gem {
  flex: none; width: 8px; height: 8px; transform: rotate(45deg); margin-top: 7px;
  background: linear-gradient(135deg, var(--iw2-gold-bright), var(--iw2-gold));
  box-shadow: 0 0 calc(9px * var(--iw2-glow)) rgba(245, 147, 66, 0.5);
}
.iw2-feature .iw2-t { font-family: var(--iw2-display); font-weight: 700; font-size: 13.5px; letter-spacing: 0.06em; color: var(--iw2-ink); }
.iw2-feature .iw2-t b { color: var(--iw2-accent-bright); font-weight: 700; }
.iw2-feature .iw2-d { font-size: 13.5px; color: var(--iw2-ink-dim); margin-top: 3px; line-height: 1.5; }

/* ---------- how to start steps ---------- */
.iw2-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.iw2-step { position: relative; padding: 20px 20px 22px; }
.iw2-step + .iw2-step { border-left: 1px solid rgba(165, 120, 200, 0.1); }
.iw2-step-n {
  font-family: var(--iw2-display); font-weight: 800; font-size: 30px; line-height: 1;
  background: linear-gradient(180deg, var(--iw2-gold-bright) 0%, var(--iw2-gold) 55%, #bb5a0a 100%);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.iw2-step-t { font-family: var(--iw2-display); font-weight: 700; font-size: 14px; letter-spacing: 0.1em; text-transform: uppercase; margin-top: 10px; color: var(--iw2-ink); }
.iw2-step-d { font-size: 13.5px; color: var(--iw2-ink-dim); margin-top: 6px; line-height: 1.55; }
.iw2-step-d a { color: var(--iw2-accent-bright) !important; text-decoration: none; }
.iw2-step-d a:hover { text-decoration: underline; }
@media (max-width: 900px) {
  .iw2-features-grid, .iw2-steps { grid-template-columns: 1fr; }
  .iw2-feature:nth-child(odd) { border-right: none; }
  .iw2-step + .iw2-step { border-left: none; border-top: 1px solid rgba(165, 120, 200, 0.1); }
}

/* ============================================================
   FOOTER V2 (markup nuovo)
   ============================================================ */
.iw2-footer { position: relative; z-index: 1; margin-top: 72px; border-top: 1px solid var(--iw2-line); background: #0c0214 !important; }
.iw2-footer::before {
  content: ""; position: absolute; top: -1px; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 10%, var(--iw2-gold-line) 50%, transparent 90%);
}
.iw2-footer-inner { max-width: 1140px; margin: 0 auto; display: flex; flex-direction: column; align-items: center; gap: 16px; padding: 36px 28px 30px; }
.iw2-footer-logo img { height: 54px; width: auto; opacity: 0.9; }
.iw2-footer-links { display: flex; gap: 8px 22px; flex-wrap: wrap; justify-content: center; }
.iw2-footer-link {
  font-family: var(--iw2-display) !important; font-size: 10.5px !important; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--iw2-ink-faint) !important; text-decoration: none; transition: color 0.15s;
}
.iw2-footer-link:hover { color: var(--iw2-gold-bright) !important; }
.iw2-footer-social { display: flex; gap: 10px; }
.iw2-footer-social a {
  width: 36px; height: 36px; border-radius: 8px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1px solid var(--iw2-line) !important; color: var(--iw2-ink-dim) !important;
  background: rgba(11, 1, 18, 0.5) !important;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.iw2-footer-social a:hover { border-color: var(--iw2-gold-line) !important; color: var(--iw2-gold-bright) !important; background: rgba(245, 147, 66, 0.08) !important; }
.iw2-footer-note { font-size: 12.5px; color: var(--iw2-ink-faint) !important; text-align: center; }
.iw2-footer-note span { color: var(--iw2-gold) !important; }

/* ============================================================
   OVERRIDE LAYER — markup legacy Imperia (pannelli amber → v2)
   ============================================================ */

/* Pannelli principali (user-panel, top10, community, server-stats, ecc.) */
body.theme-iw2 [style*="linear-gradient(135deg, #2a1f0f 0%, #1a1408 50%, #0f0a05 100%)"] {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border-color: var(--iw2-line) !important;
  box-shadow: 0 10px 32px -14px rgba(0, 0, 0, 0.7) !important;
}
/* FALLBACK UNIVERSALE: il browser serializza spesso lo style inline in rgb()
   invece di #hex quando Alpine/JS tocca l'elemento (dropdown, menu mobile,
   transizioni). Catturo tutte le forme rgb dei gradienti marroni in un colpo,
   su frontend E shop, cosi' nessun pannello/dropdown puo' restare marrone. */
body.theme-iw2 [style*="linear-gradient(135deg, rgb(42, 31, 15)"],
body.theme-iw2 [style*="linear-gradient(135deg,rgb(42,31,15)"],
body.theme-iw2 [style*="linear-gradient(180deg, rgb(42, 31, 15)"] {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  background-image: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border-color: var(--iw2-line) !important;
}
/* idem per il bottone amber serializzato rgb(120, 53, 15)->rgb(217, 119, 6) */
body.theme-iw2 [style*="linear-gradient(135deg, rgb(120, 53, 15) 0%, rgb(217, 119, 6)"] {
  background: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  background-image: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  color: #f2f8ff !important; border-color: rgba(206, 143, 255,0.5) !important;
}
/* bordi serializzati rgb del marrone #8b7355 */
body.theme-iw2 [style*="2px solid rgb(139, 115, 85)"],
body.theme-iw2 [style*="1px solid rgb(139, 115, 85)"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [style*="border: 2px solid #744b8b"] { border: 1px solid var(--iw2-line) !important; }
body.theme-iw2 .panel, body.theme-iw2 .ranking-panel, body.theme-iw2 .community-links-panel {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border: 1px solid var(--iw2-line) !important;
  border-radius: 10px !important;
  box-shadow: 0 10px 32px -14px rgba(0, 0, 0, 0.7) !important;
  position: relative;
}
/* ornamenti oro angolari sui pannelli sidebar */
body.theme-iw2 .panel::before, body.theme-iw2 .ranking-panel::before, body.theme-iw2 .community-links-panel::before {
  content: ""; position: absolute; width: 14px; height: 14px; pointer-events: none; z-index: 2;
  top: -1px; left: -1px; border-style: solid; border-color: var(--iw2-gold-line);
  border-width: 1.5px 0 0 1.5px; border-radius: 10px 0 0 0;
}
body.theme-iw2 .panel::after, body.theme-iw2 .ranking-panel::after, body.theme-iw2 .community-links-panel::after {
  content: ""; position: absolute; width: 14px; height: 14px; pointer-events: none; z-index: 2;
  bottom: -1px; right: -1px; border-style: solid; border-color: var(--iw2-gold-line);
  border-width: 0 1.5px 1.5px 0; border-radius: 0 0 10px 0;
}

/* Barre decorative 4px amber → hairline oro */
body.theme-iw2 [style*="height: 4px"][style*="#4e1b6c"] {
  height: 1px !important;
  background: linear-gradient(90deg, transparent 0%, var(--iw2-gold-line) 30%, var(--iw2-gold) 50%, var(--iw2-gold-line) 70%, transparent 100%) !important;
}

/* Header pannelli */
body.theme-iw2 [style*="background: rgba(116, 75, 139,0.15)"] {
  background: transparent !important;
  border-bottom: 1px solid var(--iw2-line) !important;
}
body.theme-iw2 .panel h2, body.theme-iw2 .ranking-panel h2, body.theme-iw2 .community-links-panel h2 {
  font-family: var(--iw2-display) !important;
  font-weight: 700 !important;
  font-size: 0.8rem !important;
  letter-spacing: 0.22em !important;
  text-transform: uppercase !important;
  color: var(--iw2-gold-bright) !important;
}
body.theme-iw2 .panel h2 i, body.theme-iw2 .ranking-panel h2 i, body.theme-iw2 .community-links-panel h2 i { color: var(--iw2-gold) !important; }

/* Corpo pannelli scuro */
body.theme-iw2 [style*="linear-gradient(180deg, rgba(15,10,5,0.95)"] {
  background: transparent !important;
}
/* Card interne (stat, link community, eventi) */
body.theme-iw2 [style*="linear-gradient(135deg, #2a1f0f 0%, #1a1408 100%)"] {
  background: rgba(11, 1, 18, 0.45) !important;
  border-color: var(--iw2-line) !important;
}

/* Input fields (user panel login, register, forms) */
body.theme-iw2 [style*="background-color: #0b050f"] {
  background-color: rgba(11, 1, 18, 0.7) !important;
  border-color: var(--iw2-line) !important;
}
body.theme-iw2 input[type="text"], body.theme-iw2 input[type="password"], body.theme-iw2 input[type="email"] {
  color: var(--iw2-ink) !important;
  font-family: var(--iw2-body) !important;
}
body.theme-iw2 input::placeholder { color: var(--iw2-ink-faint) !important; }

/* Bottoni submit + CTA amber → blu primario v2 */
body.theme-iw2 button[type="submit"],
body.theme-iw2 .auth-login-submit,
body.theme-iw2 [style*="linear-gradient(135deg, #92400e 0%, #d97706 50%, #f59e0b 100%)"],
body.theme-iw2 [style*="linear-gradient(135deg, #78350f 0%, #d97706 50%, #f59e0b 100%)"] {
  background: linear-gradient(160deg, #8d13ea 0%, #6c0fb3 55%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  border: 1px solid rgba(206, 143, 255, 0.55) !important;
  border-radius: 6px !important;
  font-family: var(--iw2-display) !important;
  font-weight: 700 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  box-shadow: 0 0 calc(28px * var(--iw2-glow)) rgba(177, 74, 255, 0.35), inset 0 1px 0 rgba(255, 255, 255,0.25) !important;
  text-shadow: 0 1px 6px rgba(34, 0, 60, 0.6) !important;
  transition: filter 0.2s, transform 0.2s, box-shadow 0.25s !important;
}
body.theme-iw2 button[type="submit"]:hover,
body.theme-iw2 [style*="linear-gradient(135deg, #5d2080 0%, #d96506 50%, #f5740b 100%)"]:hover {
  filter: brightness(1.12);
  box-shadow: 0 0 calc(44px * var(--iw2-glow)) rgba(177, 74, 255, 0.5), inset 0 1px 0 rgba(255, 255, 255,0.3) !important;
}
/* Cerchietti-icona + CTA amber 2-stop (sidebar stats/community, ranking, character) → BLU v2
   (erano resi marroni, stonavano col tema freddo) */
body.theme-iw2 a[style*="linear-gradient(135deg, #78350f 0%, #d97706 100%)"],
body.theme-iw2 button[style*="linear-gradient(135deg, #78350f 0%, #d97706 100%)"],
body.theme-iw2 div[style*="linear-gradient(135deg, #78350f 0%, #d97706 100%)"] {
  background: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  border-color: rgba(206, 143, 255, 0.5) !important;
}
body.theme-iw2 [style*="linear-gradient(135deg, #78350f 0%, #d97706 100%)"] i,
body.theme-iw2 [style*="linear-gradient(135deg, #78350f 0%, #d97706 100%)"] svg { color: #f2f8ff !important; }

/* Palette testi legacy → v2 */
body.theme-iw2 [style*="color: #f59342"]:not(i):not(svg) { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 [style*="color:#f59342"]:not(i):not(svg) { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 [style*="color: #fc9c4d"]:not(i):not(svg) { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 [style*="color:#fc9c4d"]:not(i):not(svg) { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 [style*="color: #744b8b"]:not(i):not(svg) { color: var(--iw2-ink-faint) !important; }
body.theme-iw2 [style*="color: #f5740b"]:not(i):not(svg) { color: var(--iw2-accent-bright) !important; }
body.theme-iw2 [style*="color: #d96506"]:not(i):not(svg) { color: var(--iw2-accent-bright) !important; }
body.theme-iw2 i[style*="#c9a96e"], body.theme-iw2 i[style*="#fcd34d"] { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 i[style*="#f59e0b"], body.theme-iw2 i[style*="#d97706"] { color: var(--iw2-gold) !important; }
body.theme-iw2 i[style*="#8b7355"] { color: var(--iw2-ink-faint) !important; }
body.theme-iw2 .text-\[\#c9a96e\] { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 .text-\[\#fcd34d\] { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 [class*="text-[#c9a96e"] { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 [class*="text-[#fcd34d"] { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 [class*="text-[#8b7355"] { color: var(--iw2-ink-faint) !important; }
body.theme-iw2 [class*="text-[#f59e0b"] { color: var(--iw2-accent-bright) !important; }

/* Bordi legacy → v2 */
body.theme-iw2 [style*="border: 1px solid #744b8b"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [style*="1px solid #8b7355"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [style*="rgba(139,115,85"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [style*="139, 115, 85"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [class*="border-[#8b7355"] { border-color: var(--iw2-line) !important; }
body.theme-iw2 [class*="border-[#c9a96e"] { border-color: var(--iw2-gold-line) !important; }
body.theme-iw2 [class*="bg-[#1a1408"] { background-color: rgba(21, 8, 28, 0.85) !important; }
body.theme-iw2 [class*="bg-[#78350f"] { background-color: rgba(177, 74, 255, 0.1) !important; }

/* Heading gradient amber → oro v2 */
body.theme-iw2 h1[style*="linear-gradient(135deg, #fcd34d 0%, #c9a96e 50%, #b45309 100%)"],
body.theme-iw2 [style*="linear-gradient(180deg, #f5d77e 0%, #c9a96e 50%, #a67c52 100%)"] {
  background: linear-gradient(180deg, var(--iw2-gold-bright) 0%, var(--iw2-gold) 55%, #bb5a0a 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  font-family: var(--iw2-display) !important;
  letter-spacing: 0.06em !important;
  filter: drop-shadow(0 0 calc(24px * var(--iw2-glow)) rgba(245, 147, 66, 0.25));
}
body.theme-iw2 hr[style*="linear-gradient(to right, transparent, #c9a96e 20%"] {
  background: linear-gradient(to right, transparent, var(--iw2-gold-line) 20%, var(--iw2-gold) 50%, var(--iw2-gold-line) 80%, transparent) !important;
}

/* News category pills */
body.theme-iw2 button[wire\:click^="setCategory"] {
  font-family: var(--iw2-display) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-radius: 6px !important;
  padding: 8px 14px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--iw2-ink-dim) !important;
  transition: color 0.15s, border-color 0.15s, background 0.15s !important;
}
body.theme-iw2 button[wire\:click^="setCategory"]:hover { color: var(--iw2-gold-bright) !important; }
body.theme-iw2 button[wire\:click^="setCategory"][style*="linear-gradient"] {
  color: var(--iw2-gold-bright) !important;
  border-color: var(--iw2-gold-line) !important;
  background: rgba(245, 147, 66, 0.08) !important;
}
/* news filter bar border */
body.theme-iw2 [style*="border-bottom: 1px solid rgba(116, 75, 139,0.35)"] {
  border-bottom-color: var(--iw2-line) !important;
}

/* Articoli news (page content) */
body.theme-iw2 .page {
  background: var(--iw2-bg-panel);
  border: 1px solid var(--iw2-line);
  border-radius: 10px;
  padding: 22px 24px;
}
body.theme-iw2 .page a { color: var(--iw2-accent-bright); }
body.theme-iw2 article[class*="from-gray-800"] {
  background: var(--iw2-bg-panel) !important;
  border: 1px solid var(--iw2-line) !important;
  border-radius: 10px !important;
}
body.theme-iw2 article [class*="bg-[#78350f]"] { background: transparent !important; border-bottom: 1px solid var(--iw2-line) !important; }

/* Empty state news */
body.theme-iw2 [style*="linear-gradient(135deg, rgba(26,20,8,0.7)"] {
  background: linear-gradient(160deg, rgba(29, 13, 39, 0.7), rgba(21, 8, 28, 0.7)) !important;
  border: 1px dashed var(--iw2-line) !important;
}

/* NOVA banner / shop incentive / alert banners → pannello v2 */
body.theme-iw2 [style*="linear-gradient(135deg, #1a0a05 0%, #2a1205 50%, #1a0a05 100%)"] {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border: 1px solid var(--iw2-accent-line) !important;
  box-shadow: 0 0 calc(32px * var(--iw2-glow)) rgba(177, 74, 255, 0.15) !important;
}
body.theme-iw2 [style*="border: 2px solid #f97c16"] { border: 1px solid var(--iw2-accent-line) !important; }
body.theme-iw2 [style*="linear-gradient(90deg, #dc2626, #f97316, #fbbf24, #f97316, #dc2626)"] {
  background: linear-gradient(90deg, transparent, var(--iw2-accent), var(--iw2-accent-bright), var(--iw2-accent), transparent) !important;
  height: 1px !important;
}
/* NOVA banner: icona fire (radial) + heading + barra fuoco + badge -> blu v2 */
body.theme-iw2 [style*="radial-gradient(circle at 30% 30%, #fde047 0%, #f97316 40%, #b91c1c 100%)"] {
  background: radial-gradient(circle at 35% 30%, #ce8fff 0%, #8d13ea 45%, #530b8b 100%) !important;
  border-color: rgba(206, 143, 255, 0.6) !important;
  box-shadow: 0 0 28px rgba(177, 74, 255, 0.55), inset 0 2px 8px rgba(255, 255, 255,0.2) !important;
}
body.theme-iw2 [style*="linear-gradient(180deg, #fde047 0%, #f97316 50%, #b91c1c 100%)"] {
  background: linear-gradient(180deg, #ce8fff 0%, #b14aff 50%, #6c0fb3 100%) !important;
  -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important;
}
body.theme-iw2 [style*="linear-gradient(120deg, transparent 35%, rgba(251,146,60,0.18)"] {
  background: linear-gradient(120deg, transparent 35%, rgba(177, 74, 255,0.18) 50%, transparent 65%) !important;
}
/* badge/pill arancioni (NOVA pin hero + banner badge) -> blu */
body.theme-iw2 [style*="rgba(249,115,22,0.22)"] { background: rgba(177, 74, 255,0.18) !important; border-color: rgba(206, 143, 255,0.5) !important; color: var(--iw2-accent-bright) !important; }
body.theme-iw2 [style*="linear-gradient(135deg, rgba(220,38,38,0.22) 0%, rgba(251,146,60,0.25) 100%)"] {
  background: linear-gradient(135deg, rgba(141, 19, 234,0.22) 0%, rgba(177, 74, 255,0.25) 100%) !important;
  border-color: rgba(206, 143, 255,0.55) !important; color: var(--iw2-accent-bright) !important;
}
body.theme-iw2 [style*="background:#f97c16"], body.theme-iw2 [style*="background: #f97c16"] { background: var(--iw2-accent) !important; box-shadow: 0 0 8px var(--iw2-accent) !important; }
body.theme-iw2 [style*="color:#fdb274"], body.theme-iw2 [style*="color: #fdb274"],
body.theme-iw2 [style*="color:#fd9947"], body.theme-iw2 [style*="color: #9968b5"] { color: var(--iw2-accent-bright) !important; }
/* watermark podio (#f59e0b) -> tenue blu */
body.theme-iw2 .podium-rank-watermark { color: rgba(177, 74, 255, 0.18) !important; }
/* barre decorative h-1 amber (nova/shop-incentive/hero) -> blu */
body.theme-iw2 [style*="linear-gradient(90deg, #78350f, #d97706, #f59e0b, #d97706, #78350f)"],
body.theme-iw2 [style*="linear-gradient(90deg, transparent, #d97706, #f59e0b, #d97706, transparent)"] {
  background: linear-gradient(90deg, transparent, var(--iw2-accent), var(--iw2-accent-bright), var(--iw2-accent), transparent) !important;
}

/* Podium (top10 ranking widget) */
body.theme-iw2 .podium-wrap, body.theme-iw2 [class*="podium-wrap"] {
  background: radial-gradient(at 50% 100%, rgba(177, 74, 255, 0.12) 0%, rgba(0, 0, 0, 0) 65%),
              linear-gradient(180deg, rgba(16, 6, 22, 0.7) 0%, rgba(29, 13, 39, 0.5) 100%) !important;
  border-bottom-color: var(--iw2-line) !important;
}
body.theme-iw2 .podium-skeleton-card {
  background: linear-gradient(180deg, rgba(29, 13, 39, 0.5), rgba(16, 6, 22, 0.5)) !important;
  border: 1px solid var(--iw2-line) !important;
}
body.theme-iw2 .podium-empty, body.theme-iw2 .podium-empty i { color: var(--iw2-ink-faint) !important; }

/* Tabelle (rank pages) */
body.theme-iw2 thead, body.theme-iw2 thead tr {
  background: linear-gradient(160deg, rgba(29, 13, 39, 0.85) 0%, rgba(21, 8, 28, 0.85) 100%) !important;
  border-bottom: 1px solid var(--iw2-gold-line) !important;
}
body.theme-iw2 thead th, body.theme-iw2 th {
  color: var(--iw2-gold-bright) !important;
  font-family: var(--iw2-display) !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  border-color: var(--iw2-line) !important;
}
body.theme-iw2 td { border-color: rgba(165, 120, 200, 0.08) !important; }
body.theme-iw2 tbody tr { border-bottom: 1px solid rgba(165, 120, 200, 0.08) !important; }
body.theme-iw2 tbody tr:hover { background: rgba(177, 74, 255, 0.05) !important; }

/* Sidebar items (rank page categorie) */
body.theme-iw2 .sidebar-item { color: var(--iw2-ink-dim) !important; border-radius: 6px !important; }
body.theme-iw2 .sidebar-item:hover { color: var(--iw2-gold-bright) !important; background: rgba(245, 147, 66, 0.08) !important; }
body.theme-iw2 .sidebar-item.active {
  color: var(--iw2-accent-bright) !important;
  background: var(--iw2-accent-soft) !important;
  border: 1px solid var(--iw2-accent-line) !important;
}
body.theme-iw2 .left-sidebar, body.theme-iw2 .main-content, body.theme-iw2 .download-container, body.theme-iw2 .gaming-card {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border-color: var(--iw2-line) !important;
}

/* Pagination Livewire */
body.theme-iw2 nav[role="navigation"] span, body.theme-iw2 nav[role="navigation"] a { color: var(--iw2-ink-dim) !important; }
body.theme-iw2 nav[role="navigation"] a:hover { color: var(--iw2-gold-bright) !important; }

/* Barre decorative pagina (h-1 amber) */
body.theme-iw2 [style*="linear-gradient(90deg, transparent, #d97706, #f59e0b, #d97706, transparent)"] {
  background: linear-gradient(90deg, transparent 5%, var(--iw2-gold-line) 50%, transparent 95%) !important;
}

/* Card auth/register wrapper */
body.theme-iw2 [style*="background: rgba(11, 5, 15,0.8)"],
body.theme-iw2 [style*="background:rgba(11, 5, 15,0.8)"] {
  background: linear-gradient(160deg, rgba(29, 13, 39, 0.92), rgba(21, 8, 28, 0.95)) !important;
  border-color: var(--iw2-line) !important;
}
body.theme-iw2 label[style*="Cinzel"] {
  color: var(--iw2-ink-faint) !important;
  letter-spacing: 0.18em !important;
  text-transform: uppercase !important;
  font-size: 0.68rem !important;
}

/* cookie-consent: bottone Accept ambra -> blu v2 */
body.theme-iw2 [style*="linear-gradient(135deg, #b45309 0%, #d97706 100%)"] {
  background: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  box-shadow: 0 0 15px rgba(177, 74, 255, 0.4) !important;
}
/* cookie-consent: icona ambra -> blu v2 */
body.theme-iw2 [style*="background: rgba(245, 116, 11,0.2)"] {
  background: rgba(177, 74, 255, 0.15) !important;
  border-color: rgba(177, 74, 255, 0.4) !important;
}
body.theme-iw2 [style*="background: rgba(245, 116, 11,0.2)"] svg { color: var(--iw2-accent-bright) !important; }

/* Alert / error boxes mantengono i loro colori (rosso/verde) */

/* Scroll reveal */
@media (prefers-reduced-motion: no-preference) {
  .iw2-reveal { opacity: 0; transform: translateY(20px); transition: opacity 0.7s ease, transform 0.7s cubic-bezier(0.2, 0.8, 0.2, 1); }
  .iw2-reveal.iw2-in { opacity: 1; transform: none; }
}

/* ============================================================
   SHOP (body.theme-iw2-shop) — Buy Coins e item shop
   ============================================================ */
body.theme-iw2-shop {
  --shop-bg: #100616;
  --shop-panel: linear-gradient(160deg, #230f2f 0%, #15081c 100%);
  --shop-panel-flat: #1d0d27;
  --shop-line: rgba(165, 120, 200, 0.16);
  --shop-ink: #f4eef8;
  --shop-ink-dim: #c6b4d4;
  --shop-ink-faint: #877098;
  --shop-accent: #b14aff;
  --shop-accent-bright: #ce8fff;
  --shop-accent-soft: rgba(177, 74, 255, 0.1);
  --shop-accent-line: rgba(177, 74, 255, 0.4);
  --shop-gold: #f59342;
  --shop-gold-bright: #fac89f;
  --shop-gold-line: rgba(245, 147, 66, 0.4);
  --shop-display: 'Cinzel', serif;

  background: #100616 !important;
  background-image: none !important;
  color: #f4eef8 !important;
  font-family: 'Alegreya Sans', sans-serif;
}
body.theme-iw2-shop::before { display: none !important; }
body.theme-iw2-shop .main-box {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 100%) !important;
  border: 1px solid rgba(165, 120, 200, 0.16) !important;
  box-shadow: 0 30px 70px -20px rgba(0, 0, 0, 0.8) !important;
  border-radius: 10px;
}
body.theme-iw2-shop .top-bar {
  background: rgba(12, 2, 20, 0.96) !important;
  border-bottom: 1px solid rgba(165, 120, 200, 0.16) !important;
}
body.theme-iw2-shop h1, body.theme-iw2-shop h2, body.theme-iw2-shop h3 { font-family: 'Cinzel', serif !important; }

/* ---------- struttura di shop.scss riportata alla palette v2 ----------
   Le view del negozio usano le classi qui sotto e le variabili --shop-*:
   niente piu' colori scritti dentro l'attributo style, e niente piu' regole
   che inseguono quelle stringhe. Zenthara ha le sue variabili nel layout. */
body.theme-iw2-shop .navigation {
  background: rgba(12, 2, 20, 0.7) !important;
  border-top: 1px solid var(--shop-line) !important;
  border-bottom: 1px solid var(--shop-line) !important;
  clip-path: none !important;
  border-radius: 8px;
}
body.theme-iw2-shop .navigation-item {
  background: rgba(29, 13, 39, 0.6) !important;
  color: var(--shop-ink-dim) !important;
  border: 1px solid var(--shop-line) !important;
  clip-path: none !important;
  border-radius: 6px;
}
body.theme-iw2-shop .navigation-item:hover { background: var(--shop-accent-soft) !important; color: var(--shop-ink) !important; }
body.theme-iw2-shop .navigation-item.active {
  background: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  border-color: rgba(206, 143, 255, 0.45) !important;
}
body.theme-iw2-shop .navigation-item::after { background: linear-gradient(90deg, var(--shop-accent), var(--shop-gold)) !important; }
body.theme-iw2-shop .categories {
  background: rgba(21, 8, 28, 0.6) !important;
  border: 1px solid var(--shop-line) !important;
  border-radius: 10px;
  clip-path: none !important;
  box-shadow: none !important;
  padding: 1rem !important;
  gap: 0.5rem !important;
}
body.theme-iw2-shop .category {
  background: rgba(35, 15, 47, 0.75) !important;
  border: 1px solid var(--shop-line) !important;
  clip-path: none !important;
  border-radius: 8px;
  padding: 0.85rem !important;
}
body.theme-iw2-shop .category:hover {
  background: var(--shop-accent-soft) !important;
  border-color: var(--shop-accent-line) !important;
  transform: none !important;
  box-shadow: 0 0 22px rgba(177, 74, 255, 0.12) !important;
}
body.theme-iw2-shop .category::before { background: linear-gradient(180deg, var(--shop-accent), var(--shop-gold)) !important; }
body.theme-iw2-shop .category a { color: var(--shop-ink) !important; gap: 0.5rem !important; }
body.theme-iw2-shop .category.active { border-color: var(--shop-gold-line) !important; background: rgba(245, 147, 66, 0.1) !important; }
body.theme-iw2-shop .subcategory {
  background: rgba(29, 13, 39, 0.55) !important;
  border-left: 2px solid var(--shop-line) !important;
  border-right: none !important;
  clip-path: none !important;
  border-radius: 6px;
}
body.theme-iw2-shop .subcategory:hover { background: var(--shop-accent-soft) !important; border-left-color: var(--shop-accent-line) !important; transform: none !important; box-shadow: none !important; }
body.theme-iw2-shop .subcategory-name { color: var(--shop-ink-dim) !important; }
body.theme-iw2-shop .subcategory.active { border-left-color: var(--shop-gold) !important; }
body.theme-iw2-shop .main-slot {
  background: rgba(21, 8, 28, 0.55) !important;
  border: 1px solid var(--shop-line) !important;
  border-radius: 10px;
  clip-path: none !important;
  padding: 1.5rem !important;
  box-shadow: none !important;
}
body.theme-iw2-shop .main-slot::before { display: none !important; }
body.theme-iw2-shop .shop-pagination .page-item {
  background: rgba(35, 15, 47, 0.8) !important;
  border: 1px solid var(--shop-line) !important;
  color: var(--shop-ink-dim) !important;
  clip-path: none !important;
  border-radius: 6px;
}
body.theme-iw2-shop .shop-pagination .page-item.active {
  background: linear-gradient(160deg, #8d13ea 0%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  transform: none !important;
}
body.theme-iw2-shop .shop-pagination .page-item::before { display: none !important; }
body.theme-iw2-shop input, body.theme-iw2-shop select, body.theme-iw2-shop textarea {
  background: rgba(11, 1, 18, 0.7) !important;
  border: 1px solid rgba(165, 120, 200, 0.16) !important;
  color: #f4eef8 !important;
}
body.theme-iw2-shop input:focus, body.theme-iw2-shop select:focus {
  border-color: rgba(177, 74, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(177, 74, 255, 0.12) !important;
  outline: none !important;
}
body.theme-iw2-shop button[type="submit"], body.theme-iw2-shop .btn-primary {
  background: linear-gradient(160deg, #8d13ea 0%, #6c0fb3 55%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  border: 1px solid rgba(206, 143, 255, 0.55) !important;
  border-radius: 6px !important;
  font-family: 'Cinzel', serif !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  box-shadow: 0 0 28px rgba(177, 74, 255, 0.35), inset 0 1px 0 rgba(255, 255, 255,0.25) !important;
}
/* shop top-bar "Buy coins" CTA (shop.scss usa gradiente ambra) -> blu v2 */
body.theme-iw2-shop .buy-coins-button {
  background: linear-gradient(135deg, #8d13ea 0%, #530b8b 100%) !important;
  color: #f2f8ff !important;
  box-shadow: 0 4px 25px rgba(177, 74, 255, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.2) !important;
}
/* CTA oro (usata da "Compra monete" nelle pagine interne) */
body.theme-iw2-shop .iw-btn-gold {
  background: linear-gradient(160deg, #fac89f 0%, #f59342 55%, #d8670b 100%) !important;
  color: #180821 !important;
  border-color: rgba(250, 200, 159, 0.6) !important;
}

/* ============================================================
   IW2 OVERRIDES — componenti marroni legacy sulla home/news
   ============================================================ */

/* ---------- Presentation CTA banner ---------- */
body.theme-iw2 .presentation-cta-card {
  border: 1px solid rgba(165, 120, 200, 0.25) !important;
  box-shadow: 0 14px 50px rgba(0, 0, 0, 0.7), 0 0 40px rgba(177, 74, 255, 0.12) !important;
}
body.theme-iw2 .presentation-cta-card:hover {
  border-color: rgba(206, 143, 255, 0.45) !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.8), 0 0 60px rgba(177, 74, 255, 0.22) !important;
}
body.theme-iw2 .presentation-cta-card > div[style*="linear-gradient(90deg"] {
  background: linear-gradient(90deg,
    rgba(12, 2, 20, 0.95) 0%,
    rgba(21, 8, 28, 0.82) 40%,
    rgba(12, 2, 20, 0.65) 75%,
    rgba(12, 2, 20, 0.92) 100%) !important;
}
body.theme-iw2 .presentation-cta-card .absolute.top-0,
body.theme-iw2 .presentation-cta-card .absolute.bottom-0 {
  background: linear-gradient(90deg, transparent, #b14aff, #ce8fff, #b14aff, transparent) !important;
}
body.theme-iw2 .presentation-cta-card .fa-scroll,
body.theme-iw2 .presentation-cta-card h2,
body.theme-iw2 .presentation-cta-card p {
  color: #f4eef8 !important;
}
body.theme-iw2 .presentation-cta-card > div > div > div > div[style*="background: linear-gradient(135deg"] {
  background: linear-gradient(135deg, #6c0fb3 0%, #8d13ea 50%, #b14aff 100%) !important;
  border: 2px solid #ce8fff !important;
  box-shadow: 0 0 28px rgba(177, 74, 255, 0.45), 0 6px 16px rgba(0, 0, 0, 0.5) !important;
}
body.theme-iw2 .presentation-cta-btn {
  background: linear-gradient(135deg, #6c0fb3 0%, #8d13ea 50%, #b14aff 100%) !important;
  border: 2px solid #ce8fff !important;
  color: #f2f8ff !important;
  box-shadow: 0 0 32px rgba(177, 74, 255, 0.55), 0 8px 22px rgba(0, 0, 0, 0.45) !important;
  animation: iw2CtaPulse 2.6s ease-in-out infinite 1.2s;
}
@keyframes iw2CtaPulse {
  0%, 100% { box-shadow: 0 0 32px rgba(177, 74, 255, 0.55), 0 8px 22px rgba(0, 0, 0, 0.45); }
  50% { box-shadow: 0 0 52px rgba(177, 74, 255, 0.85), 0 10px 28px rgba(0, 0, 0, 0.5); }
}
body.theme-iw2 .presentation-cta-card span[style*="background: rgba(251, 133, 36,0.18)"] {
  background: rgba(177, 74, 255, 0.12) !important;
  color: #ce8fff !important;
  border: 1px solid rgba(177, 74, 255, 0.4) !important;
}

/* ---------- Feature video carousel ---------- */
body.theme-iw2 #features {
  background: linear-gradient(180deg, rgba(16, 6, 22, 0) 0%, rgba(16, 6, 22, 0.6) 12%, rgba(16, 6, 22, 0.82) 50%, rgba(16, 6, 22, 0.6) 88%, rgba(16, 6, 22, 0) 100%) !important;
}
body.theme-iw2 #features .absolute.top-0,
body.theme-iw2 #features .absolute.bottom-0 {
  background: linear-gradient(90deg, transparent, rgba(177, 74, 255, 0.55), transparent) !important;
}
body.theme-iw2 #features h2 {
  background: linear-gradient(180deg, #fac89f 0%, #f59342 55%, #bb5a0a 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body.theme-iw2 #features p[style*="color:#f59342"] { color: #c6b4d4 !important; }
body.theme-iw2 .feature-card {
  background: #0b0112 !important;
  border: 1px solid rgba(165, 120, 200, 0.2) !important;
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.6), inset 0 0 0 1px rgba(177, 74, 255, 0.08) !important;
}
body.theme-iw2 .feature-card:hover {
  border-color: rgba(206, 143, 255, 0.45) !important;
}
body.theme-iw2 .feature-loading {
  background: linear-gradient(135deg, #1d0d27 0%, #100616 100%) !important;
}
body.theme-iw2 .feature-loading i { color: #b14aff !important; }
body.theme-iw2 .feature-card figcaption span[style*="background: linear-gradient(135deg, #5d2080"] {
  background: linear-gradient(135deg, #530b8b, #6c0fb3) !important;
  border: 1.5px solid #ce8fff !important;
  color: #f2f8ff !important;
  box-shadow: 0 0 18px rgba(177, 74, 255, 0.45), 0 4px 12px rgba(0, 0, 0, 0.5) !important;
}
body.theme-iw2 .feature-card h3 {
  color: #ce8fff !important;
}
body.theme-iw2 .feature-card .absolute.top-3.right-3 {
  background: #ce8fff !important;
  box-shadow: 0 0 12px #ce8fff !important;
}
body.theme-iw2 .carousel-arrow {
  background: #ce8fff !important;
  background-image: linear-gradient(135deg, #ce8fff 0%, #b14aff 55%, #6c0fb3 100%) !important;
  border: 3px solid #f2f8ff !important;
  color: #100616 !important;
  box-shadow: 0 0 0 4px rgba(16, 6, 22, 0.9), 0 0 28px rgba(177, 74, 255, 0.7), 0 10px 24px rgba(0, 0, 0, 0.7) !important;
}
body.theme-iw2 .carousel-arrow:hover {
  background-image: linear-gradient(135deg, #f2e0ff 0%, #ce8fff 55%, #b14aff 100%) !important;
  box-shadow: 0 0 0 4px rgba(16, 6, 22, 0.95), 0 0 40px rgba(177, 74, 255, 1), 0 12px 30px rgba(0, 0, 0, 0.8) !important;
}
body.theme-iw2 #features .md\:hidden span[style*="background:#f5740b"] {
  background: #b14aff !important;
  box-shadow: 0 0 8px #b14aff !important;
}
body.theme-iw2 #features .md\:hidden span:not([style*="background:#f5740b"]) {
  background: rgba(165, 120, 200, 0.4) !important;
}

/* ---------- Shop incentive banner ---------- */
body.theme-iw2 .iw2-shop-incentive > div:first-child {
  background: linear-gradient(135deg, #1d0d27 0%, #15081c 50%, #0c0214 100%) !important;
  border: 1px solid rgba(165, 120, 200, 0.2) !important;
  box-shadow: 0 0 30px rgba(177, 74, 255, 0.12) !important;
}
body.theme-iw2 .iw2-shop-incentive > div:first-child > div:first-child {
  background: linear-gradient(90deg, #b14aff, #ce8fff, #b14aff) !important;
}
body.theme-iw2 .iw2-shop-incentive [style*="background: rgba(245, 116, 11,0.2)"] {
  background: rgba(177, 74, 255, 0.12) !important;
  border: 1px solid rgba(177, 74, 255, 0.35) !important;
}
body.theme-iw2 .iw2-shop-incentive [style*="background: rgba(245, 116, 11,0.2)"] svg,
body.theme-iw2 .iw2-shop-incentive [style*="color: #f5740b"] { color: #ce8fff !important; }
body.theme-iw2 .iw2-shop-incentive h3[style*="background: linear-gradient(180deg, #f8b37b"] {
  background: linear-gradient(180deg, #fac89f 0%, #f59342 50%, #bb5a0a 100%) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
body.theme-iw2 .iw2-shop-incentive p,
body.theme-iw2 .iw2-shop-incentive span[style*="color: #744b8b"] { color: #c6b4d4 !important; }
body.theme-iw2 .iw2-shop-incentive a[style*="background: linear-gradient(135deg, #f59342"] {
  background: linear-gradient(135deg, #6c0fb3 0%, #8d13ea 100%) !important;
  color: #f2f8ff !important;
  border: 1px solid rgba(206, 143, 255, 0.55) !important;
  box-shadow: 0 0 15px rgba(177, 74, 255, 0.4) !important;
}
body.theme-iw2 .iw2-shop-incentive a[style*="background: linear-gradient(135deg, #200f2a"] {
  background: linear-gradient(135deg, #15081c 0%, #0b0112 100%) !important;
  color: #ce8fff !important;
  border: 1px solid rgba(165, 120, 200, 0.25) !important;
}
body.theme-iw2 .iw2-shop-incentive > div:nth-child(2),
body.theme-iw2 .iw2-shop-incentive > div:nth-child(3) {
  background: rgba(177, 74, 255, 0.06) !important;
  border: 1px solid rgba(165, 120, 200, 0.16) !important;
}
body.theme-iw2 .iw2-shop-incentive > div:nth-child(2) h4,
body.theme-iw2 .iw2-shop-incentive > div:nth-child(3) h4 { color: #ce8fff !important; }
body.theme-iw2 .iw2-shop-incentive a[href*="/shop"] {
  background: linear-gradient(135deg, #15081c 0%, #0b0112 100%) !important;
  border: 1px solid rgba(165, 120, 200, 0.2) !important;
}
body.theme-iw2 .iw2-shop-incentive a[href*="/shop"] div[style*="color: #fc9c4d"] { color: #ce8fff !important; }
body.theme-iw2 .iw2-shop-incentive a[href*="/shop"] span[style*="color: #f5740b"] { color: #b14aff !important; }
body.theme-iw2 .iw2-shop-incentive a[href*="/shop"] span[style*="color: #744b8b"] { color: #877098 !important; }

/* ---------- Lead popup ---------- */
body.theme-iw2 .iw2-lead-popup-wrapper > div[x-data] {
  background: rgba(11, 1, 18, 0.78) !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper > div[x-data] > div {
  background: linear-gradient(160deg, #1d0d27 0%, #15081c 70%) !important;
  border: 1px solid rgba(165, 120, 200, 0.25) !important;
  box-shadow: 0 0 80px rgba(177, 74, 255, 0.25) !important;
  color: #f4eef8 !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper [style*="color: #f59342"] { color: #ce8fff !important; }
body.theme-iw2 .iw2-lead-popup-wrapper [style*="color: #fc9c4d"] { color: #fac89f !important; }
body.theme-iw2 .iw2-lead-popup-wrapper [style*="background: linear-gradient(160deg, #d96506, #b45609)"] {
  background: linear-gradient(160deg, #8d13ea, #6c0fb3) !important;
  color: #f2f8ff !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper input,
body.theme-iw2 .iw2-lead-popup-wrapper input[type="email"],
body.theme-iw2 .iw2-lead-popup-wrapper input[type="tel"] {
  background: rgba(11, 1, 18, 0.85) !important;
  border: 1px solid rgba(165, 120, 200, 0.2) !important;
  color: #f4eef8 !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper input:focus {
  border-color: rgba(177, 74, 255, 0.4) !important;
  box-shadow: 0 0 0 3px rgba(177, 74, 255, 0.12) !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper button[type="submit"] {
  background: linear-gradient(135deg, #530b8b, #6c0fb3) !important;
  border: 1px solid rgba(206, 143, 255, 0.55) !important;
  color: #f2f8ff !important;
}
body.theme-iw2 .iw2-lead-popup-wrapper label input[type="checkbox"] { accent-color: #b14aff; }
body.theme-iw2 .iw2-lead-popup-wrapper label span { color: #c6b4d4 !important; }

/* ============================================================
   IW2 NAVIGATION — menu desktop/mobile ancora marrone/oro
   ============================================================ */

/* Sfondo header e bordo inferiore */
body.theme-iw2 .iw2-navigation {
  background: linear-gradient(180deg, rgba(12, 2, 20, 0.98) 0%, rgba(21, 8, 28, 0.95) 100%) !important;
  border-bottom: 2px solid rgba(177, 74, 255, 0.35) !important;
}

/* Link nav: testo, icone, span */
body.theme-iw2 .iw2-navigation a:not(.iw2-online-chip),
body.theme-iw2 .iw2-navigation a span,
body.theme-iw2 .iw2-navigation a svg {
  color: #ce8fff !important;
}

/* Hover link nav (sia desktop che mobile) */
body.theme-iw2 .iw2-navigation a:hover,
body.theme-iw2 .iw2-navigation a:hover span,
body.theme-iw2 .iw2-navigation a:hover svg {
  color: #f2f8ff !important;
}

/* Link attivo e hover con gradiente marrone -> blu */
body.theme-iw2 .iw2-navigation a[class*="from-[#78350f]"],
body.theme-iw2 .iw2-navigation a[class*="to-[#92400e]"] {
  background-image: linear-gradient(90deg, #530b8b 0%, #6c0fb3 50%, #9523ed 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  color: #f2f8ff !important;
}
body.theme-iw2 .iw2-navigation a[class*="from-[#78350f]"] span,
body.theme-iw2 .iw2-navigation a[class*="from-[#78350f]"] svg {
  color: #f2f8ff !important;
}

/* Hover su link non attivi */
body.theme-iw2 .iw2-navigation a:hover[class*="hover:from-[#4e1b6c]"] {
  background-image: linear-gradient(90deg, #530b8b 0%, #6c0fb3 50%, #9523ed 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
}

/* Bottone Download desktop */
body.theme-iw2 .iw2-navigation a[href*="/download"].hidden.lg\:flex {
  background: linear-gradient(90deg, #530b8b 0%, #6c0fb3 50%, #9523ed 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  color: #f2f8ff !important;
  box-shadow: 0 0 20px rgba(177, 74, 255, 0.35) !important;
}
body.theme-iw2 .iw2-navigation a[href*="/download"].hidden.lg\:flex:hover {
  box-shadow: 0 0 28px rgba(177, 74, 255, 0.55) !important;
}

/* Language selector button */
body.theme-iw2 .iw2-navigation button[class*="bg-[#1a1408]"] {
  background: rgba(12, 2, 20, 0.85) !important;
  border-color: rgba(177, 74, 255, 0.25) !important;
}
body.theme-iw2 .iw2-navigation button[class*="bg-[#1a1408]"]:hover {
  background: rgba(177, 74, 255, 0.12) !important;
  border-color: rgba(177, 74, 255, 0.45) !important;
}
body.theme-iw2 .iw2-navigation button[class*="bg-[#1a1408]"] span,
body.theme-iw2 .iw2-navigation button[class*="bg-[#1a1408]"] svg {
  color: #ce8fff !important;
}

/* Language dropdown panel */
body.theme-iw2 .iw2-navigation .relative > div[x-show="open"] {
  background: linear-gradient(135deg, #15081c 0%, #0c0214 100%) !important;
  border-color: rgba(177, 74, 255, 0.35) !important;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.6), 0 0 30px rgba(177, 74, 255, 0.15) !important;
}
body.theme-iw2 .iw2-navigation .relative > div[x-show="open"] a {
  color: #ce8fff !important;
}
body.theme-iw2 .iw2-navigation .relative > div[x-show="open"] a:hover {
  background: rgba(177, 74, 255, 0.12) !important;
  color: #f2f8ff !important;
}
body.theme-iw2 .iw2-navigation .relative > div[x-show="open"] a[class*="bg-[#78350f]"] {
  background: rgba(177, 74, 255, 0.18) !important;
}

/* Mobile menu panel */
body.theme-iw2 .iw2-navigation .border-t.max-h-\[80vh\] {
  background: linear-gradient(135deg, #15081c 0%, #0c0214 100%) !important;
  border-color: rgba(177, 74, 255, 0.18) !important;
}
body.theme-iw2 .iw2-navigation .border-t.max-h-\[80vh\] a:not([class*="from-blue-"]):not([class*="from-[#4e1b6c]"]) {
  color: #ce8fff !important;
}
body.theme-iw2 .iw2-navigation .border-t.max-h-\[80vh\] a:not([class*="from-blue-"]):not([class*="from-[#4e1b6c]"]):hover {
  background: linear-gradient(90deg, rgba(83, 11, 139, 0.4) 0%, rgba(108, 15, 179, 0.35) 100%) !important;
  color: #f2f8ff !important;
}
/* Mobile active link (marrone) -> blu */
body.theme-iw2 .iw2-navigation .border-t.max-h-\[80vh\] a[class*="from-[#78350f]"],
body.theme-iw2 .iw2-navigation .border-t.max-h-\[80vh\] a[class*="to-[#92400e]"] {
  background: linear-gradient(90deg, #530b8b 0%, #6c0fb3 50%, #9523ed 100%) !important;
  border-color: rgba(206, 143, 255, 0.55) !important;
  color: #f2f8ff !important;
}

/* Hamburger button */
body.theme-iw2 .iw2-navigation button[aria-label="Toggle navigation menu"] {
  color: #ce8fff !important;
}

/* Online chip (gia' blu, non toccare) */
body.theme-iw2 .iw2-navigation .iw2-online-chip {
  color: #f2f8ff !important;
}


/* ============================================================
   FIX LAYOUT NAVBAR DESKTOP (>= 1536px)
   Il contenitore dell'header e' max-w-screen-2xl (1536px) mentre il
   contenuto (logo + nav centrale + CTA + chip + lingua) misura fino a
   1865px: il gruppo di destra usciva dalla barra fino a 329px (misurato
   su tutte e 8 le lingue) e il bottone "Download Game" si spezzava su
   due righe sfondando l'altezza della barra.
   Qui il contenitore diventa a larghezza piena sopra i 1536px e la nav
   centrale usa una spaziatura compatta: il contenuto rientra in tutte
   le lingue da 1536px a 2560px.
   ============================================================ */
@media (min-width: 1536px) {
  body.theme-iw2 .iw2-navigation > div:first-child {
    max-width: none;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
  }
  /* nav centrale: spaziatura compatta, etichette mai spezzate */
  body.theme-iw2 .iw2-navigation > div:first-child > div:nth-child(2) > a {
    margin-left: 0.375rem;
    padding-left: 0.625rem;
    padding-right: 0.625rem;
    white-space: nowrap;
  }
  body.theme-iw2 .iw2-navigation > div:first-child > div:nth-child(2) > a:first-child {
    margin-left: 0;
  }
  /* gruppo destro: non si comprime, CTA sempre su una riga sola */
  body.theme-iw2 .iw2-navigation > div:first-child > div:last-child {
    flex-shrink: 0;
  }
  body.theme-iw2 .iw2-navigation > div:first-child > div:last-child > a:first-child {
    white-space: nowrap;
    flex-shrink: 0;
  }
  /* Sopra i 1536px la voce "Download" del menu centrale e' il doppione del
     CTA "Download Game" che le sta subito a destra: si tiene solo il CTA. */
  body.theme-iw2 .iw2-navigation > div:first-child > div:nth-child(2) > a[href$="/download"] {
    display: none;
  }
}

/* Fascia 1536-1727px: le lingue lunghe (de, ro, es, pl) restano al limite
   anche dopo quanto sopra, quindi qui la nav centrale si stringe ancora. */
@media (min-width: 1536px) and (max-width: 1727px) {
  body.theme-iw2 .iw2-navigation > div:first-child {
    padding-left: 0.75rem;
    padding-right: 0.75rem;
  }
  body.theme-iw2 .iw2-navigation > div:first-child > div:nth-child(2) > a {
    margin-left: 0.125rem;
    padding-left: 0.4rem;
    padding-right: 0.4rem;
  }
  body.theme-iw2 .iw2-navigation > div:first-child > div:nth-child(2) > a span {
    font-size: 15px;
  }
}

/* ============================================================
   FIX LARGHEZZA CONTENUTO SU MOBILE
   Sulle pagine ranking i padding annidati (px-3 esterno + .page 24px +
   wrapper p-2 + .ranking-container p-4) mangiavano 120px dei 390 dello
   schermo: la tabella restava schiacciata in 224px. Qui si recuperano
   ~94px sotto i 640px, senza toccare tablet e desktop.
   ============================================================ */
@media (max-width: 640px) {
  body.theme-iw2 .page {
    padding: 14px 8px;
  }
  body.theme-iw2 .ranking-container {
    padding: 8px;
  }
}

/* ============================================================
   BERSAGLI DI TOCCO SU TELEFONO (>= 44px)
   Filtri delle news alti 34px, nomi dei giocatori 25px, link di testo
   14-20px: col dito si sbagliava bersaglio di continuo. Dove la riga ha
   gia' la sua altezza si allarga solo l'AREA CLICCABILE (padding + margine
   negativo di pari valore), cosi' l'impaginazione non cambia di un pixel.
   ============================================================ */
@media (max-width: 640px) {
  body.theme-iw2 .iw2-news-filters button {
    min-height: 44px;
  }

  /* Nome giocatore nella top 10: 25px -> 44px senza alzare la riga. */
  body.theme-iw2 .iw2-tap-link {
    padding-top: 14px;
    padding-bottom: 14px;
    margin-top: -14px;
    margin-bottom: -14px;
  }

  /* Link dentro il testo (passi "Come iniziare", nota sotto i bottoni hero). */
  body.theme-iw2 .iw2-step-d a,
  body.theme-iw2 .iw2-hero-note a {
    display: inline-block;
    padding: 11px 0;
    margin: -11px 0;
  }

  /* Elenco link del footer: righe separate e alte abbastanza da centrare. */
  body.theme-iw2 .iw2-footer-link {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* Pannello di login: "Registrati", "Nome utente/Password dimenticata?". */
  body.theme-iw2 .iw2-tap-links a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }

  /* Pulsanti piccoli senza testo (occhio della password) e linguette
     Giocatori/Gilde della top 10. */
  body.theme-iw2 .iw2-tap-btn {
    min-height: 44px;
    min-width: 44px;
  }
}

/* ============================================================
   PILLOLA SOPRA IL LOGO SU SCHERMI STRETTI
   Con letter-spacing 0.4em la riga non ci sta in 390px: andava a capo
   dentro la pillola e il pallino luminoso restava da solo sulla sinistra.
   ============================================================ */
@media (max-width: 520px) {
  body.theme-iw2 .iw2-hero-eyebrow {
    font-size: 9.5px;
    letter-spacing: 0.22em;
    padding: 8px 14px 8px 12px;
    gap: 8px;
  }
}

/* ============================================================
   ICONE FONT AWESOME MANCANTI DAL BUNDLE
   resources/sass/fontawesome-lite.css tiene solo una manciata di icone
   (era stato ridotto per non caricare i 500KB del CSS completo), ma nelle
   viste se ne usano molte altre: per quelle il browser non trovava nessun
   ::before e disegnava il nulla — cerchi vuoti nelle statistiche, filtri
   news senza glifo, occhio della password che spariva.
   Il file .woff2 ha TUTTI i 3.931 glifi: mancavano solo le regole CSS, che
   sono queste. Estratte da resources/sass/fontawesome.css (Pro 6.1.2).
   Se si aggiungono icone nuove alle viste, rigenerare questo blocco.
   ============================================================ */
.fa-arrow-right-arrow-left::before { content: "\f0ec"; }
.fa-arrow-right-from-bracket::before { content: "\f08b"; }
.fa-backward::before { content: "\f04a"; }
.fa-ban::before { content: "\f05e"; }
.fa-book::before { content: "\f02d"; }
.fa-book-open::before { content: "\f518"; }
.fa-box::before { content: "\f466"; }
.fa-bullhorn::before { content: "\f0a1"; }
.fa-bullseye::before { content: "\f140"; }
.fa-calendar-day::before { content: "\f783"; }
.fa-chart-bar::before { content: "\f080"; }
.fa-check-double::before { content: "\f560"; }
.fa-circle-exclamation::before { content: "\f06a"; }
.fa-circle-notch::before { content: "\f1ce"; }
.fa-circle-play::before { content: "\f144"; }
.fa-circle-question::before { content: "\f059"; }
.fa-clipboard-check::before { content: "\f46c"; }
.fa-clock-rotate-left::before { content: "\f1da"; }
.fa-cloud-rain::before { content: "\f73d"; }
.fa-code::before { content: "\f121"; }
.fa-code-branch::before { content: "\f126"; }
.fa-cogs::before { content: "\f085"; }
.fa-compass::before { content: "\f14e"; }
.fa-crosshairs::before { content: "\f05b"; }
.fa-database::before { content: "\f1c0"; }
.fa-diamond::before { content: "\f219"; }
.fa-dungeon::before { content: "\f6d9"; }
.fa-edge::before { content: "\f282"; }
.fa-envelope-circle-check::before { content: "\e4e8"; }
.fa-envelope-open-text::before { content: "\f658"; }
.fa-exchange-alt::before { content: "\f362"; }
.fa-exclamation-circle::before { content: "\f06a"; }
.fa-eye-slash::before { content: "\f070"; }
.fa-face-thinking::before { content: "\e39b"; }
.fa-feather::before { content: "\f52d"; }
.fa-film::before { content: "\f008"; }
.fa-fire::before { content: "\f06d"; }
.fa-fish::before { content: "\f578"; }
.fa-flask::before { content: "\f0c3"; }
.fa-forward::before { content: "\f04e"; }
.fa-hammer::before { content: "\f6e3"; }
.fa-horse::before { content: "\f6f0"; }
.fa-hourglass-start::before { content: "\f251"; }
.fa-khanda::before { content: "\f66d"; }
.fa-layer-group::before { content: "\f5fd"; }
.fa-level-up-alt::before { content: "\f3bf"; }
.fa-lightbulb::before { content: "\f0eb"; }
.fa-link-slash::before { content: "\f127"; }
.fa-lock-open::before { content: "\f3c1"; }
.fa-microscope::before { content: "\f610"; }
.fa-mobile-alt::before { content: "\f3cd"; }
.fa-moon::before { content: "\f186"; }
.fa-newspaper::before { content: "\f1ea"; }
.fa-opera::before { content: "\f26a"; }
.fa-percentage::before { content: "\25"; }
.fa-person::before { content: "\f183"; }
.fa-phone::before { content: "\f095"; }
.fa-piggy-bank::before { content: "\f4d3"; }
.fa-project-diagram::before { content: "\f542"; }
.fa-question-circle::before { content: "\f059"; }
.fa-ranking-star::before { content: "\e561"; }
.fa-right-from-bracket::before { content: "\f2f5"; }
.fa-right-to-bracket::before { content: "\f2f6"; }
.fa-road::before { content: "\f018"; }
.fa-rotate::before { content: "\f2f1"; }
.fa-rotate-right::before { content: "\f2f9"; }
.fa-safari::before { content: "\f267"; }
.fa-satellite-dish::before { content: "\f7c0"; }
.fa-scale-balanced::before { content: "\f24e"; }
.fa-screwdriver-wrench::before { content: "\f7d9"; }
.fa-scroll::before { content: "\f70e"; }
.fa-search::before { content: "\f002"; }
.fa-shield-alt::before { content: "\f3ed"; }
.fa-shield-halved::before { content: "\f3ed"; }
.fa-shield-slash::before { content: "\e24b"; }
.fa-shopping-cart::before { content: "\f07a"; }
.fa-sitemap::before { content: "\f0e8"; }
.fa-spinner::before { content: "\f110"; }
.fa-stairs::before { content: "\e289"; }
.fa-stars::before { content: "\f762"; }
.fa-sun::before { content: "\f185"; }
.fa-swords::before { content: "\f71d"; }
.fa-tablet-alt::before { content: "\f3fa"; }
.fa-tag::before { content: "\f02b"; }
.fa-tasks::before { content: "\f0ae"; }
.fa-ticket::before { content: "\f145"; }
.fa-ticket-alt::before { content: "\f3ff"; }
.fa-torii-gate::before { content: "\f6a1"; }
.fa-unlink::before { content: "\f127"; }
.fa-user-secret::before { content: "\f21b"; }
.fa-user-shield::before { content: "\f505"; }
.fa-user-tie::before { content: "\f508"; }
.fa-users-slash::before { content: "\e073"; }
.fa-venus-mars::before { content: "\f228"; }
.fa-wand-magic-sparkles::before { content: "\e2ca"; }
.fa-wrench::before { content: "\f0ad"; }
.fa-yin-yang::before { content: "\f6ad"; }

/* ---------------------------------------------------------------------------
   AUDIT DESKTOP 2026-08-06
   1) La barra "SERVER ONLINE" era larga 740px mentre il resto della pagina e'
      largo 1376px: sembrava un elemento incollato di un'altra pagina, e il suo
      titolo andava a capo su due righe pur avendo mezza barra vuota a destra.
      Il countdown (barra corta, tutta centrata) resta com'era.
   2) "Scaricalo qui." si spezzava fra due righe nel passo 02.
   3) I tre pannelli di chiusura avevano altezze diverse (328/265/296) perche'
      la griglia era items-start: ora si allungano al piu' alto.
   --------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  body.theme-iw2 .iw2-live-bar { max-width: none; padding: 18px 32px; }
  body.theme-iw2 .iw2-live-bar .iw2-t { white-space: nowrap; }
}

body.theme-iw2 .iw2-step-d a { white-space: nowrap; }

body.theme-iw2 .iw2-band > * { height: 100%; }

/* Fascia finale: il pannello Community attaccava il titolo al bordo superiore
   (2px dal top) mentre Statistiche e Discord lo tengono a 26px, e l'intera
   colonna di destra risultava sfalsata verso l'alto. */
body.theme-iw2 .iw2-band .community-links-panel h2 { padding-top: 40px; }

/* ---------------------------------------------------------------------------
   CLASSIFICHE (rank/player, guild, playtime, staff) — audit 2026-08-06
   Sul desktop la tabella era piu' larga del suo contenitore e l'ultima colonna
   ("Tempo di gioco") restava tagliata dietro uno scroll orizzontale che nessuno
   nota: 630px di tabella dentro 594px di pannello. Colpa di `min-width: 600px`
   sommato ai 20px di padding per cella, in un'area gia' stretta perche' la
   pagina ha DUE navigazioni a sinistra (sidebar del sito + menu categorie).
   - da 1440px in su: padding celle piu' compatto e niente min-width fissa,
     cosi' le 5 colonne entrano intere;
   - fra 1024 e 1439px: il menu categorie va sopra la tabella invece che di
     fianco, altrimenti al contenuto restano 282px;
   - il riquadro categorie non si stira piu' per tutta l'altezza della pagina
     (era alto 4.280px per quattro voci).
   Sotto i 1024px non cambia nulla: li' il layout era gia' impilato.
   --------------------------------------------------------------------------- */
@media (min-width: 1024px) {
  body.theme-iw2 .ranking-table { min-width: 0; }
  body.theme-iw2 .ranking-table thead th,
  body.theme-iw2 .ranking-table td { padding-left: 12px; padding-right: 12px; }
  body.theme-iw2 .left-sidebar { align-self: flex-start; }
}
@media (min-width: 1024px) and (max-width: 1439px) {
  body.theme-iw2 .flex-container { flex-direction: column; }
  body.theme-iw2 .left-sidebar { width: auto; }
}

/* Classifiche su telefono: la tabella era larga 600px (min-width) dentro un
   riquadro da 272px — piu' di meta' classifica restava fuori, raggiungibile
   solo con uno scroll orizzontale dentro il pannello che non si vede. Si
   recuperano i padding annidati e si comprimono le celle: a 390px le cinque
   colonne entrano tutte (taglio 0), a 360px restano 4px. */
@media (max-width: 639px) {
  body.theme-iw2 .ranking-container { padding: 4px !important; }
  body.theme-iw2 .main-content { padding: 8px !important; }
  body.theme-iw2 .main-content::before { margin: -8px -8px 8px !important; }
  body.theme-iw2 .ranking-table { min-width: 0 !important; }
  body.theme-iw2 .ranking-table thead th { padding: 8px 3px !important; font-size: 10px !important; letter-spacing: 0 !important; }
  body.theme-iw2 .ranking-table td { padding: 8px 3px !important; font-size: 11px !important; }
}
@media (max-width: 400px) {
  body.theme-iw2 .ranking-table thead th,
  body.theme-iw2 .ranking-table td { padding: 8px 2px !important; }
  body.theme-iw2 .ranking-table td img { width: 26px !important; height: 26px !important; }
}

/* Classifiche: bersagli tocco sotto i 44px sul telefono (voci del menu
   categorie e link "Armeria" nelle righe). Il link Armeria si allarga con
   padding + margine negativo, cosi' la riga non cresce. */
@media (max-width: 639px) {
  body.theme-iw2 .sidebar-item { min-height: 44px; }
  body.theme-iw2 .armory-btn {
    min-height: 44px; min-width: 44px;
    justify-content: center;
  }
}

/* ------------------------------------------------------------------
   Patch notes dagli annunci Discord (12-09-2026)
   Prima arrivavano come muro di testo: titolo ripetuto due volte,
   quattro <br> di fila che aprivano buchi da 60px, e le sezioni
   ("STAR DUST", "8 INVENTORIES") indistinguibili dalle voci sotto.
   Adesso il servizio le marca e qui si vedono per quello che sono.
   ------------------------------------------------------------------ */
.iw2-pn-testo {
    margin: 0 0 0.85rem;
    line-height: 1.65;
    color: #d7cbe1;
}

.iw2-pn-sezione {
    margin: 1.35rem 0 0.6rem;
    padding-left: 0.7rem;
    border-left: 3px solid #f59342;
    font-family: 'Cinzel', serif;
    font-size: 0.98rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: 0.02em;
    color: #f8b57e;
    overflow-wrap: anywhere;
}

.iw2-pn-sezione:first-child {
    margin-top: 0;
}

.iw2-pn-lista {
    margin: 0 0 0.85rem;
    padding-left: 1.15rem;
    list-style: none;
}

.iw2-pn-lista li {
    position: relative;
    margin-bottom: 0.4rem;
    line-height: 1.6;
    color: #d7cbe1;
    overflow-wrap: anywhere;
}

.iw2-pn-lista li::before {
    content: '';
    position: absolute;
    left: -0.9rem;
    top: 0.6em;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #f59342;
    opacity: 0.75;
}

/* segnale che l'annuncio continua: una riga sottile, non un buco vuoto */
.iw2-pn-ancora {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    margin: 0.9rem 0 0.4rem;
    font-size: 0.78rem;
    font-style: italic;
    letter-spacing: 0.03em;
    color: #8c7c98;
}

.iw2-pn-ancora::after {
    content: '';
    flex: 1;
    height: 1px;
    background: linear-gradient(90deg, rgba(245, 147, 66,0.35), transparent);
}

@media (max-width: 639px) {
    .iw2-pn-sezione { font-size: 0.9rem; margin-top: 1.1rem; }
    .iw2-pn-testo,
    .iw2-pn-lista li { font-size: 0.9rem; }
}

/* --- patch notes: rifiniture 12-09-2026 ---------------------------------
   Guardando la home a zone su desktop (1600px) e telefono (390px) sono
   emerse tre cose da sistemare, tutte sul testo degli annunci. */

/* 1. Su desktop la riga arrivava a 966px, circa 130 caratteri: l'occhio
      perde il capo riga. Il tetto e' in "ch" (larghezza del carattere)
      cosi' segue la dimensione del font invece di un valore fisso. */
.iw2-pn-testo,
.iw2-pn-lista li {
    max-width: 82ch;
}

/* 2. Le voci che portano gia' il loro simbolo (🟢 Green, ⚠️ ...) non
      devono ricevere anche il pallino oro: sarebbero due segni di
      elenco sulla stessa riga. */
.iw2-pn-lista li.iw2-pn-voce-simbolo::before {
    content: none;
}

.iw2-pn-lista li.iw2-pn-voce-simbolo {
    padding-left: 0;
}

/* 3. Sul telefono lo spazio e' poco: si toglie il tetto (ci pensa gia'
      la larghezza dello schermo) e si stringono i margini. */
@media (max-width: 639px) {
    .iw2-pn-testo,
    .iw2-pn-lista li {
        max-width: none;
    }
}

/* --- rifiniture da audit su 3 pagine x 3 formati, 12-09-2026 -------------
   Trovate provando /, /news e /all-news a 1600px, 820px e 390px. */

@media (max-width: 639px) {
    /* Il link "Login" nella riga sotto al pulsante era largo 29px: troppo
       poco per il polpastrello, che ne vuole almeno 44. Si allarga il
       bersaglio senza spostare il testo, con il padding orizzontale. */
    .iw2-hero-note a {
        display: inline-block;
        min-width: 44px;
        min-height: 44px;
        padding: 11px 8px;
        text-align: center;
    }

    /* "PLAYERS ONLINE" e i link in fondo erano a 10,5px: sotto gli 11px
       il testo in maiuscolo con la spaziatura fra lettere diventa
       faticoso su uno schermo piccolo. */
    .iw2-count-unit {
        font-size: 11.5px;
    }

    .iw2-footer-link {
        font-size: 11.5px !important;
        /* stessa ragione del Login: il bersaglio deve essere toccabile */
        display: inline-block;
        padding: 8px 4px;
    }
}