/* Тема «vivid»: пурпурная аура фона и светящаяся рамка карточки Дара.
   Идёт после app.css и намеренно переопределяет его правила. */
:root{--vio:#a855f7}
/* Фон — заметная пурпурная аура */
body::before{background:
  radial-gradient(70% 46% at 50% -4%, rgba(168,85,247,0.30), transparent 70%),
  radial-gradient(50% 40% at 88% 22%, rgba(212,175,55,0.10), transparent 70%),
  radial-gradient(60% 50% at 8% 86%, rgba(168,85,247,0.14), transparent 72%) !important;}

/* Карточка Дара — светящаяся градиентная рамка золото→фиолет */
.result-card{
  border:1.5px solid transparent !important;
  background:linear-gradient(160deg,#141019,#0b0910) padding-box,
             linear-gradient(135deg, rgba(232,198,107,0.9), rgba(168,85,247,0.9)) border-box !important;
  box-shadow:0 24px 70px -22px rgba(0,0,0,0.75), 0 0 60px -16px rgba(168,85,247,0.4) !important;}
.dar-image-wrap{position:relative}
.dar-image-wrap::before{content:"";position:absolute;inset:-16px;border-radius:50%;
  background:radial-gradient(closest-side, rgba(168,85,247,0.55), transparent);filter:blur(12px);z-index:0;
  animation:ysPulse 4s ease-in-out infinite}
.dar-image-wrap img{position:relative;z-index:1}
@keyframes ysPulse{0%,100%{opacity:.5;transform:scale(.92)}50%{opacity:1;transform:scale(1.06)}}
.dar-name,#darName{
  background:linear-gradient(120deg,#ffffff 8%, #E8C66B 48%, #a855f7 92%) !important;
  -webkit-background-clip:text !important;background-clip:text !important;
  -webkit-text-fill-color:transparent !important;color:transparent !important;
  text-shadow:none !important;filter:drop-shadow(0 0 14px rgba(168,85,247,0.35))}

/* Главная кнопка послания — из контурной в золотую CTA со свечением и бликом */
#btn-get-message{
  background:linear-gradient(135deg,#F4D98B,#D4AF37,#b8860b) !important;color:#1a1206 !important;
  border:none !important;font-weight:800 !important;
  box-shadow:0 10px 30px rgba(212,175,55,0.42) !important;position:relative;overflow:hidden}
#btn-get-message::after{content:"";position:absolute;top:0;left:-60%;width:50%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,0.65),transparent);transform:skewX(-20deg);
  animation:ysSheen 3.6s ease-in-out infinite;pointer-events:none}
@keyframes ysSheen{0%{left:-60%}55%,100%{left:130%}}

/* Карточки-крючки — ярче + лёгкое парение */
#daily-activities>div[onclick],.me-diary-card,.me-science-card{
  transition:transform .25s, border-color .25s, box-shadow .25s !important}
#daily-activities>div[onclick]{
  background:linear-gradient(135deg,rgba(212,175,55,0.18),rgba(168,85,247,0.10)) !important;
  border-color:rgba(212,175,55,0.5) !important;box-shadow:0 10px 30px -10px rgba(212,175,55,0.22) !important}
.me-diary-card{background:linear-gradient(135deg,rgba(168,85,247,0.20),rgba(168,85,247,0.06)) !important;
  border-color:rgba(168,85,247,0.5) !important}
.me-science-card{background:linear-gradient(135deg,rgba(74,134,232,0.18),rgba(74,134,232,0.05)) !important;
  border-color:rgba(74,134,232,0.5) !important}
#daily-activities>div[onclick]:hover,.me-diary-card:hover,.me-science-card:hover{transform:translateY(-4px)}

/* Нижняя навигация — активная вкладка светится */
.nav-btn.active{
  background:linear-gradient(135deg,rgba(212,175,55,0.22),rgba(168,85,247,0.16)) !important;
  border-color:rgba(232,198,107,0.6) !important;box-shadow:0 0 18px rgba(168,85,247,0.25) !important}

/* Шапка — лёгкое сияние логотипа */
header h1{filter:drop-shadow(0 0 10px rgba(168,85,247,0.30))}

@media (prefers-reduced-motion:reduce){
  .dar-image-wrap::before,#btn-get-message::after{animation:none !important}}