/* Revival (templates/lsx-revival.html.twig). */
.lsx-rev { max-width: 1000px; margin: 0 auto; padding: 1.5rem; border-radius: 18px; background: radial-gradient(circle at 85% 0%, #14532d, transparent 40%), radial-gradient(circle at 10% 10%, #4c1d95, transparent 45%), linear-gradient(180deg, #13132e, #0b0f1f); color: #e8ebff; }
.lsx-rev h1 { font-weight: 900; color: #fff; }
.lsx-rev h2 { margin: 1.6rem 0 0.75rem; font-size: 1.2rem; font-weight: 800; color: #bbf7d0; }
.lsx-rev h2 small { color: #a5acd6; font-size: 0.8rem; font-weight: 600; }
.lsx-rev__hero p { color: #c7cbff; }
.lsx-rev__status { margin: 1rem 0; padding: 0.5rem 0.9rem; border-radius: 10px; font-weight: 700; }
.lsx-rev__status.is-ok { background: rgba(74, 222, 128, 0.15); color: #86efac; }
.lsx-rev__status.is-error { background: rgba(248, 113, 113, 0.15); color: #fca5a5; }
.lsx-rev__pots { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.75rem; }
.lsx-rev__pot { display: flex; flex-direction: column; align-items: center; gap: 0.4rem; padding: 0.9rem 0.6rem; border: 1px solid rgba(255, 255, 255, 0.1); border-radius: 16px; background: rgba(255, 255, 255, 0.04); color: #e8ebff; text-align: center; }
.lsx-rev__pot strong { color: #fff; }
.lsx-rev__pot strong small { display: block; color: #a5acd6; font-weight: 600; }
.lsx-rev__pot.is-ready { border-color: #4ade80; box-shadow: 0 0 18px rgba(74, 222, 128, 0.35); }
.lsx-rev__pot.is-new { justify-content: center; border: 2px dashed rgba(255, 255, 255, 0.2); background: transparent; cursor: pointer; }
.lsx-rev__pot.is-new > i { font-size: 1.6rem; color: #bbf7d0; }
.lsx-rev__pot.is-new span { color: #facc15; font-weight: 700; }
.lsx-rev__cauldron { position: relative; display: grid; place-items: center; width: 4.5rem; height: 4rem; overflow: hidden; border: 3px solid #475569; border-top-width: 6px; border-radius: 10px 10px 2.2rem 2.2rem; background: #111827; }
.lsx-rev__cauldron > i { position: relative; color: rgba(255, 255, 255, 0.25); font-size: 1.4rem; }
.lsx-rev__liquid { position: absolute; bottom: 0; left: 0; right: 0; background: var(--brew); box-shadow: 0 0 14px var(--brew); }
.lsx-rev__pot.is-brewing .lsx-rev__liquid { animation: lsx-rev-bubble 1.6s ease-in-out infinite; }
@keyframes lsx-rev-bubble { 50% { filter: brightness(1.35); } }
.lsx-rev__state { min-height: 2.4em; color: #c7cbff; font-size: 0.8rem; }
.lsx-rev__max { color: #a5acd6; font-size: 0.75rem; }
.lsx-rev__gone { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 0.75rem; }
.lsx-rev__mut { padding: 0.9rem; border: 1px solid rgba(255, 255, 255, 0.1); border-left: 5px solid var(--brew); border-radius: 14px; background: rgba(255, 255, 255, 0.04); }
.lsx-rev__mut h3 { display: flex; gap: 0.5rem; align-items: center; margin: 0 0 0.3rem; font-size: 1.05rem; font-weight: 800; color: #fff; }
.lsx-rev__mut p { color: #c7cbff; }
.lsx-rev__swatch { width: 1rem; height: 1rem; border-radius: 50%; background: linear-gradient(135deg, var(--brew), var(--brew2)); box-shadow: 0 0 8px var(--brew); }
.lsx-rev__brew { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.lsx-rev__potions { display: flex; flex-direction: column; gap: 0.5rem; }
.lsx-rev__potion { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; padding: 0.6rem 0.8rem; border-radius: 12px; background: rgba(74, 222, 128, 0.08); }
.lsx-rev__potion strong { min-width: 10rem; color: #bbf7d0; }
.lsx-rev__potion select { max-width: 18rem; border-color: rgba(255, 255, 255, 0.18); background-color: rgba(255, 255, 255, 0.06); color: #fff; }
.lsx-rev__potion select option { color: #0b1026; }
@media (prefers-reduced-motion: reduce) { .lsx-rev__pot.is-brewing .lsx-rev__liquid { animation: none; } }