/* Challenges, the weekend tournament and achievements (challenges.js). */
.ch-main{ padding-top:1.2rem; padding-bottom:3rem; }
.ch-hero{ display:flex; justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap; padding:1.3rem 1.4rem; border-radius:20px; color:#fff;
  background:radial-gradient(circle at 100% 0%, rgba(255,203,5,.22), transparent 50%), linear-gradient(135deg, #8a1c0a, #2a0a14 70%);
  border:1px solid rgba(255,203,5,.3); }
.ch-hero > div:first-child{ flex:1; min-width:240px; }
.ch-kicker{ font:800 .75rem var(--font-display); letter-spacing:.16em; text-transform:uppercase; color:#ffe28a; }
.ch-hero h1{ margin:.2rem 0 .4rem; font:900 2.3rem var(--font-display); line-height:1; }
.ch-sub{ margin:.3rem 0 0; color:#f2d8cf; font-size:.9rem; }
.ch-ready{ display:flex; flex-direction:column; align-items:center; padding:.6rem 1rem; border-radius:14px; background:rgba(35,209,139,.18); border:1px solid #23d18b; }
.ch-ready strong{ font:900 1.8rem var(--font-display); color:#7be3a4; line-height:1; }
.ch-ready span{ font-size:.75rem; color:#d8ffe8; }
.ch-msg{ min-height:1.2em; margin:.7rem 0 .2rem; color:#ffb347; font-weight:600; }
.ch-msg.good{ color:#23d18b; }

.ch-grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:1rem; }
.ch-card{ padding:1rem 1.1rem; border-radius:16px; background:var(--surface); border:1px solid var(--border); }
.ch-head{ display:flex; justify-content:space-between; align-items:baseline; gap:.6rem; margin-bottom:.6rem; }
.ch-head h2{ margin:0; font:800 1.2rem var(--font-display); }
.ch-timer{ font:600 .8rem var(--font-mono, monospace); color:var(--ink-faint); }
.ch-list{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; }
.ch-item{ display:flex; gap:.8rem; align-items:center; padding:.6rem .7rem; border-radius:12px; background:rgba(127,127,127,.07); border:1px solid transparent; }
.ch-item.ready{ border-color:#23d18b; box-shadow:0 0 14px rgba(35,209,139,.25); }
.ch-item.claimed{ opacity:.55; }
.ch-item-main{ flex:1; min-width:0; display:grid; gap:.3rem; }
.ch-item-text{ font-weight:600; font-size:.92rem; }
.ch-item-value{ font-size:.75rem; color:var(--ink-faint); }
.ch-item-side{ display:flex; flex-direction:column; align-items:flex-end; gap:.3rem; flex:none; }
.ch-reward{ color:#e0a800; font-size:1rem; }
.ch-reward::after{ content:" gold"; font:600 .7rem var(--font-body, sans-serif); color:var(--ink-faint); }
.ch-state{ font-size:.75rem; color:#23d18b; font-weight:700; }
.ch-bar{ height:8px; border-radius:999px; background:rgba(127,127,127,.2); overflow:hidden; }
.ch-bar span{ display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg, #ffcb05, #ff8a3d); transition:width .4s; }
.ch-item.ready .ch-bar span, .ch-ach-card.maxed .ch-bar span{ background:linear-gradient(90deg, #23d18b, #7be3a4); }

/* ---------- Tournament ---------- */
.ch-tour{ margin:1.2rem 0; padding:1.1rem 1.2rem; border-radius:20px; color:#fff;
  background:radial-gradient(circle at 0% 0%, rgba(255,210,63,.18), transparent 45%), linear-gradient(135deg, #2a1a5a, #0f0a24 70%);
  border:1px solid rgba(255,210,63,.35); }
.ch-tour.running{ box-shadow:0 0 0 1px rgba(255,210,63,.5), 0 0 30px rgba(255,210,63,.18); }
.ch-tour-top{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.ch-trophy{ width:84px; height:84px; flex:none; filter:drop-shadow(0 6px 10px rgba(0,0,0,.4)); }
@media (prefers-reduced-motion: no-preference){
  .ch-tour.running .ch-trophy{ animation:ch-shine 2.4s ease-in-out infinite; }
  @keyframes ch-shine{ 50%{ transform:translateY(-4px) rotate(-3deg); filter:drop-shadow(0 0 14px rgba(255,210,63,.7)); } }
}
.ch-tour-info{ flex:1; min-width:220px; }
.ch-tour-info h2{ margin:.1rem 0 .2rem; font:900 1.6rem var(--font-display); }
.ch-tour .ch-sub{ color:#d8ccff; }
.ch-tour-body{ display:grid; grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr); gap:1.2rem; margin-top:1rem; }
@media (max-width:700px){ .ch-tour-body{ grid-template-columns:1fr; } }
.ch-tour h3{ margin:0 0 .5rem; font:800 .95rem var(--font-display); color:#ffe28a; }
.ch-board{ list-style:none; margin:0; padding:0; display:grid; gap:.35rem; }
.ch-row{ display:grid; grid-template-columns:1.8rem 28px minmax(0, 1fr) auto 3.4rem; align-items:center; gap:.5rem; padding:.35rem .5rem; border-radius:10px; background:rgba(255,255,255,.06); }
.ch-row.p1{ background:linear-gradient(90deg, rgba(255,210,63,.3), rgba(255,255,255,.05)); }
.ch-row.p2{ background:linear-gradient(90deg, rgba(200,210,230,.25), rgba(255,255,255,.05)); }
.ch-row.p3{ background:linear-gradient(90deg, rgba(205,127,50,.28), rgba(255,255,255,.05)); }
.ch-place{ font:900 .95rem var(--font-display); text-align:center; }
.ch-av{ width:28px; height:28px; border-radius:50%; object-fit:cover; background:rgba(255,255,255,.15); }
.ch-name{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-weight:600; }
.ch-prize{ text-align:right; color:#ffd23f; font-size:.8rem; }
.ch-empty{ padding:.6rem; }
.ch-prizes{ list-style:none; margin:0 0 1rem; padding:0; display:grid; gap:.3rem; }
.ch-prizes li{ display:flex; justify-content:space-between; padding:.3rem .6rem; border-radius:8px; background:rgba(255,255,255,.06); }
.ch-prizes li.p1 b{ color:#ffd23f; }
.ch-pastrow{ display:flex; flex-direction:column; margin:.2rem 0 .5rem; font-size:.82rem; }
.ch-tour .muted{ color:#b9a9dd; }

/* ---------- Achievements ---------- */
.ch-title{ font:800 1.3rem var(--font-display); margin:1.2rem 0 .7rem; }
.ch-ach{ display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:.9rem; }
.ch-ach-card{ display:grid; gap:.45rem; padding:.9rem 1rem; border-radius:16px; background:var(--surface); border:1px solid var(--border); }
.ch-ach-card.maxed{ border-color:rgba(35,209,139,.6); }
.ch-ach-top{ display:flex; gap:.7rem; align-items:center; }
.ch-ach-top > div{ display:flex; flex-direction:column; min-width:0; }
.ch-ach-icon{ display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:12px; font-size:1.5rem; background:rgba(255,203,5,.14); }
.ch-pips{ display:grid; grid-template-columns:repeat(4, 1fr); gap:.4rem; margin-top:.2rem; }
.ch-pip{ display:flex; flex-direction:column; align-items:center; gap:.1rem; padding:.35rem .2rem; border-radius:10px; border:2px solid transparent;
  background:rgba(127,127,127,.1); color:var(--ink-faint); font:inherit; cursor:default; }
.ch-pip-num{ font:900 .85rem var(--font-display); }
.ch-pip small{ font-size:.66rem; }
.ch-pip.t0.claimed{ background:linear-gradient(160deg, #e0a06a, #9a5a2a); color:#fff; }
.ch-pip.t1.claimed{ background:linear-gradient(160deg, #eef2f8, #9aa6b8); color:#1d2433; }
.ch-pip.t2.claimed{ background:linear-gradient(160deg, #fff3b0, #d9a000); color:#3a2a00; }
.ch-pip.t3.claimed{ background:linear-gradient(160deg, #d6b8ff, #6a2bb8); color:#fff; }
.ch-pip.ready{ border-color:#23d18b; color:#23d18b; cursor:pointer; background:rgba(35,209,139,.12); }
@media (prefers-reduced-motion: no-preference){
  .ch-pip.ready{ animation:ch-glow 1.6s ease-in-out infinite; }
  @keyframes ch-glow{ 50%{ box-shadow:0 0 14px rgba(35,209,139,.5); } }
}

/* ---------- Player level ---------- */
.lv-card{ margin:.4rem 0 1.1rem; padding:1rem 1.1rem; border-radius:18px; background:var(--surface); border:1px solid var(--border); }
.lv-top{ display:flex; align-items:center; gap:1rem; flex-wrap:wrap; }
.lv-badge{ display:flex; flex-direction:column; align-items:center; justify-content:center; width:84px; height:84px; flex:none; border-radius:50%; color:#2a1a00;
  background:radial-gradient(circle at 35% 30%, #fff6c4, #ffcb05 55%, #b98300); box-shadow:0 0 0 4px #7a4a12, 0 6px 16px rgba(0,0,0,.3); }
.lv-badge small{ font:800 .62rem var(--font-display); letter-spacing:.14em; text-transform:uppercase; }
.lv-badge strong{ font:900 2rem var(--font-display); line-height:1; }
.lv-info{ flex:1; min-width:220px; }
.lv-bar{ height:14px; border-radius:999px; background:rgba(127,127,127,.2); overflow:hidden; }
.lv-bar span{ display:block; height:100%; width:0; border-radius:inherit; background:linear-gradient(90deg, #ffcb05, #ff8ac7, #7c9bff); box-shadow:0 0 12px rgba(255,203,5,.5); transition:width .5s; }
.lv-sub{ margin:.4rem 0 .1rem; font-weight:700; }
.lv-track{ display:flex; gap:.5rem; overflow-x:auto; padding:.8rem .1rem .4rem; scroll-behavior:smooth; }
.lv-cell{ flex:none; width:118px; display:flex; flex-direction:column; align-items:center; gap:.3rem; padding:.55rem .45rem; border-radius:14px; text-align:center;
  background:rgba(127,127,127,.08); border:1px solid transparent; opacity:.7; }
.lv-cell.reached{ opacity:1; border-color:rgba(245,192,74,.4); }
.lv-cell.ready{ border-color:#23d18b; box-shadow:0 0 14px rgba(35,209,139,.3); }
.lv-num{ font:900 .85rem var(--font-display); color:#e0a800; }
.lv-banner{ width:100%; height:34px; border-radius:8px; background-size:200% 100% !important; }
.lv-frame{ width:40px; height:40px; border-radius:50%; -webkit-mask:radial-gradient(circle, transparent 54%, #000 56%); mask:radial-gradient(circle, transparent 54%, #000 56%); }
.lv-title{ font:800 .78rem var(--font-display); padding:.2rem .4rem; border-radius:6px; background:rgba(245,192,74,.16); }
.lv-cell small{ font-size:.68rem; color:var(--ink-faint); }
.lv-gold{ color:#e0a800; font-size:.85rem; }
.lv-state{ font-size:.7rem; font-weight:700; color:#23d18b; min-height:1em; }
