/* ===================================================================
   活动中心 events.html · 专属样式
   深紫星空 · 童话活动 · 星光日历与奖励宝箱
   =================================================================== */

/* 两列整体布局 */
.ev{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(0,1fr);gap:16px;align-items:start}
.ev__left{display:flex;flex-direction:column;gap:14px;min-width:0}
.ev__right{display:flex;flex-direction:column;gap:14px;min-width:0}

/* 页面标题 */
.ev-head__title{font-family:var(--font-disp);font-size:34px;font-weight:700;letter-spacing:1px;line-height:1;
  background:linear-gradient(100deg,#ffd27a 0%,#ff9ad5 50%,#b79bff 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 4px 22px rgba(120,80,255,.4)}
.ev-head__sub{margin-top:6px;color:var(--ink-soft);font-size:13.5px;letter-spacing:.5px}

/* ============ 活动 Banner ============ */
.ev-banner{position:relative;border-radius:24px;overflow:hidden;min-height:248px;
  border:1px solid var(--brd);box-shadow:var(--shadow);display:flex;align-items:center}
.ev-banner__art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 82%}
.ev-banner__scrim{position:absolute;inset:0;
  background:linear-gradient(90deg,rgba(24,14,62,.95) 0%,rgba(28,16,68,.84) 32%,rgba(30,18,72,.4) 60%,rgba(28,16,68,.25) 100%),
    linear-gradient(180deg,rgba(24,14,62,.45) 0%,transparent 30%)}
.ev-banner__body{position:relative;z-index:2;padding:26px 30px;max-width:62%}
.ev-banner__title{font-family:var(--font-disp);font-size:27px;font-weight:700;line-height:1.1;
  text-shadow:0 3px 16px rgba(40,20,90,.7);margin-bottom:8px}
.ev-banner__desc{color:var(--ink-soft);font-size:13.5px;margin-bottom:14px}
.ev-banner__tags{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.ev-tag{font-size:11.5px;padding:5px 12px;border-radius:20px;color:var(--ink-soft);
  background:rgba(255,255,255,.12);border:1px solid var(--brd)}
.ev-tag--gold{color:#5a3410;background:linear-gradient(135deg,var(--gold-1),var(--gold-2));border-color:transparent;font-weight:600}
.ev-banner__cta{display:flex;gap:12px;flex-wrap:wrap}
.ev-banner__cta .btn{font-size:14px;padding:10px 22px}
.ev-banner__cta .btn span{font-size:15px}

/* ============ 分类 Tab ============ */
.ev-tabs{display:flex;gap:9px;flex-wrap:wrap}
.ev-tab{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--brd);cursor:pointer;
  padding:9px 16px;border-radius:18px;font-family:var(--font);font-size:13px;color:var(--ink-soft);
  background:var(--glass);transition:.2s}
.ev-tab__ico{font-size:14px;line-height:1}
.ev-tab:hover{background:var(--glass-2);color:#fff;transform:translateY(-1px)}
.ev-tab.is-active{color:#fff;font-weight:600;border-color:rgba(190,150,255,.7);
  background:linear-gradient(135deg,rgba(150,92,255,.55),rgba(120,80,255,.4));
  box-shadow:0 8px 20px -8px rgba(140,90,255,.7)}

/* ============ 活动卡网格 ============ */
.ev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.ev-card{position:relative;border-radius:20px;overflow:hidden;min-height:182px;cursor:pointer;
  border:1px solid var(--brd);box-shadow:var(--shadow);display:flex;align-items:stretch;
  transition:transform .25s,box-shadow .25s}
.ev-card:hover{transform:translateY(-5px);box-shadow:0 26px 44px -18px rgba(10,4,40,.8)}
.ev-card__art{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right top}
.ev-card__scrim{position:absolute;inset:0;
  background:linear-gradient(95deg,rgba(26,15,64,.97) 0%,rgba(30,18,72,.9) 40%,rgba(34,20,80,.5) 70%,rgba(34,20,80,.28) 100%)}
.ev-card__no{position:absolute;top:12px;left:14px;z-index:3;width:24px;height:24px;border-radius:50%;
  display:grid;place-items:center;font-family:var(--font-disp);font-weight:700;font-size:13px;color:#fff;
  background:linear-gradient(135deg,var(--violet),#6a4cff);box-shadow:0 4px 10px -2px rgba(110,76,255,.7)}
.ev-card__body{position:relative;z-index:2;padding:16px 16px;display:flex;flex-direction:column;
  align-items:flex-start;gap:6px;width:64%}
.ev-card__body h3{font-size:15px;font-weight:700;line-height:1.25;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.ev-card__time{font-size:12.5px;color:#ffe7a8;font-weight:600}
.ev-card__reward{font-size:11.5px;color:var(--ink-soft);line-height:1.4}
.ev-card__btn{margin-top:auto;border:none;cursor:pointer;font-family:var(--font);font-size:12.5px;font-weight:600;
  padding:8px 16px;border-radius:16px;color:#fff;transition:.2s}
.ev-card__btn:hover{transform:translateY(-2px)}
.ev-card__btn--gold{color:#5a3410;background:linear-gradient(135deg,var(--gold-1),var(--gold-2));
  box-shadow:0 8px 16px -6px rgba(255,176,58,.6)}
.ev-card__btn--green{background:linear-gradient(135deg,#5ed6a8,#37b985);box-shadow:0 8px 16px -6px rgba(55,185,133,.5)}
.ev-card__btn--violet{background:linear-gradient(135deg,#9a6cff,#6f4cff);box-shadow:0 8px 16px -6px rgba(120,80,255,.5)}

/* ============ 即将开启的活动旅程 ============ */
.ev-journey{padding:16px 18px;border-radius:22px;background:var(--glass);border:1px solid var(--brd);backdrop-filter:blur(10px)}
.ev-journey__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.ev-journey__head h3{font-size:15px;font-weight:700}
.ev-journey__more{font-size:12px;color:var(--ink-mute);text-decoration:none}
.ev-journey__more:hover{color:var(--ink-soft)}
.ev-journey__row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.ev-dest{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--brd);
  box-shadow:var(--shadow);cursor:pointer;transition:transform .25s}
.ev-dest:hover{transform:translateY(-4px)}
.ev-dest img{display:block;width:100%;height:96px;object-fit:cover}
.ev-dest::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,transparent 40%,rgba(22,12,56,.92) 100%)}
.ev-dest__cap{position:absolute;left:10px;bottom:24px;z-index:2;display:flex;align-items:center;gap:4px;
  font-size:13px;font-weight:700;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.ev-dest__pin{font-size:11px}
.ev-dest__sub{position:absolute;left:10px;bottom:8px;z-index:2;font-size:10.5px;color:var(--ink-soft);
  text-shadow:0 1px 4px rgba(0,0,0,.6)}

/* ============ 玻璃面板通用 ============ */
.panel{padding:16px 18px;border-radius:22px;background:var(--glass);border:1px solid var(--brd);backdrop-filter:blur(10px);box-shadow:var(--shadow)}
.panel__head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.panel__head h3{display:flex;align-items:center;gap:7px;font-size:15.5px;font-weight:700}
.panel__ico{font-size:16px}
.panel__more{font-size:12px;color:var(--ink-mute);text-decoration:none;white-space:nowrap}
.panel__more:hover{color:var(--ink-soft)}

/* ============ 星光活动日历 ============ */
.ev-cal__days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:14px}
.ev-day{display:flex;flex-direction:column;align-items:center;gap:3px;padding:9px 2px;border-radius:13px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.ev-day__w{font-size:10px;color:var(--ink-mute)}
.ev-day b{font-family:var(--font-disp);font-size:16px;font-weight:600}
.ev-day.is-today{background:linear-gradient(135deg,#fff6df,#ffe7a8);border-color:rgba(255,255,255,.5);
  box-shadow:0 8px 18px -6px rgba(255,200,90,.6)}
.ev-day.is-today .ev-day__w{color:#7a4a14;font-weight:600}
.ev-day.is-today b{color:#5a3410}
.ev-cal__list{list-style:none;display:flex;flex-direction:column;gap:8px}
.ev-cal__list li{display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:14px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09)}
.ev-cal__ico{font-size:15px;flex:none}
.ev-cal__t{font-family:var(--font-disp);font-size:12.5px;font-weight:600;color:#ffe7a8;flex:none;min-width:38px}
.ev-cal__name{font-size:12.5px;color:var(--ink-soft);flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ev-pill{font-size:10.5px;padding:3px 10px;border-radius:12px;font-weight:600;flex:none}
.ev-pill--pink{color:#fff;background:linear-gradient(135deg,#ff8fc0,#ff5fa8)}
.ev-pill--green{color:#fff;background:linear-gradient(135deg,#5ed6a8,#37b985)}
.ev-pill--violet{color:#fff;background:linear-gradient(135deg,#9a6cff,#6f4cff)}
.ev-cal__full{display:block;text-align:center;margin-top:12px;font-size:12px;color:var(--ink-mute);text-decoration:none}
.ev-cal__full:hover{color:var(--ink-soft)}

/* ============ 奖励宝箱 ============ */
.ev-reward__hint{font-size:11px;color:var(--ink-mute);text-align:right;max-width:140px;line-height:1.3}
.ev-reward__icons{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-bottom:14px}
.ev-rwd{display:flex;flex-direction:column;align-items:center;gap:6px}
.ev-rwd__img{position:relative;width:100%;aspect-ratio:1/1;border-radius:16px;display:grid;place-items:center;
  font-size:30px;background:linear-gradient(160deg,rgba(150,110,255,.28),rgba(110,80,200,.18));
  border:1px solid var(--brd)}
.ev-rwd__num{position:absolute;right:5px;bottom:4px;font-family:var(--font-disp);font-size:11px;font-weight:700;
  color:#5a3410;background:var(--gold-1);padding:1px 6px;border-radius:9px;box-shadow:0 2px 6px rgba(0,0,0,.3)}
.ev-rwd span{font-size:11px;color:var(--ink-soft)}
.ev-reward__stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;padding-top:14px;
  border-top:1px solid rgba(255,255,255,.1)}
.ev-stat{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;border-radius:14px;
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.ev-stat__label{font-size:10.5px;color:var(--ink-mute);text-align:center}
.ev-stat b{font-family:var(--font-disp);font-size:19px;font-weight:700}
.ev-stat__gold{font-size:15px!important;color:var(--gold-1)}

/* ============ 解锁进度 ============ */
.ev-unlock{position:relative;padding:18px 20px;border-radius:22px;
  background:linear-gradient(135deg,rgba(150,92,255,.22),rgba(255,126,194,.16));
  border:1px solid rgba(190,150,255,.35);box-shadow:var(--shadow);overflow:hidden}
.ev-unlock__title{font-size:13px;color:var(--ink-soft);text-align:center;margin-bottom:16px}
.ev-unlock__title b{color:var(--gold-1);font-family:var(--font-disp);font-size:15px}
.ev-unlock__row{display:flex;align-items:flex-start;justify-content:center;gap:4px;position:relative}
.ev-step{display:flex;flex-direction:column;align-items:center;gap:7px;flex:none;width:72px}
.ev-step__icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:19px;
  background:rgba(255,255,255,.1);border:1.5px solid var(--brd)}
.ev-step span{font-size:10.5px;color:var(--ink-mute);text-align:center}
.ev-step.is-done .ev-step__icon{color:#fff;font-weight:700;
  background:linear-gradient(135deg,#7ad0a0,#37b985);border-color:transparent;box-shadow:0 6px 14px -4px rgba(55,185,133,.6)}
.ev-step.is-done span{color:var(--ink-soft)}
.ev-step__line{flex:1;height:2px;margin-top:21px;border-radius:2px;min-width:18px;
  background:linear-gradient(90deg,rgba(255,255,255,.3),rgba(255,255,255,.12))}
.ev-unlock__star{position:absolute;right:6px;top:-2px;font-size:30px;filter:drop-shadow(0 2px 8px rgba(255,210,90,.6))}

/* ============ 响应式 ============ */
@media(max-width:1280px){
  .ev{grid-template-columns:1fr}
}
@media(max-width:760px){
  .ev-grid{grid-template-columns:1fr}
  .ev-journey__row{grid-template-columns:repeat(2,1fr)}
  .ev-banner__body{max-width:100%}
  .ev-reward__icons,.ev-reward__stats{grid-template-columns:repeat(2,1fr)}
}
