
*{box-sizing:border-box}
:root{--purple:#7655ff;--pink:#f43b83;--green:#16b878;--blue:#2296e8;--orange:#ff9d16;--ink:#29234d;--muted:#6d6683;--card:#fff}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--ink);background:linear-gradient(135deg,#f5f1ff 0%,#fff 48%,#fff8e9 100%);min-height:100vh}
a{text-decoration:none;color:inherit}
.top{background:linear-gradient(90deg,#5a2bd6,#8a3cff);color:#fff;text-align:center;padding:10px 16px;font-weight:900;font-size:14px}
.nav{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:20}
.navin{max-width:1280px;margin:auto;padding:14px 18px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.logo{font-weight:1000;font-size:22px;white-space:nowrap}.logo small{display:block;font-size:10px;color:var(--muted)}
.navlinks{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.navlinks a{padding:9px 12px;border-radius:999px;font-weight:900}.navlinks a:hover{background:#f2edff;color:var(--purple)}
.wrap{max-width:1280px;margin:auto;padding:25px 18px 70px}
.hero{background:linear-gradient(135deg,#fff,#f1ecff);border:1px solid #e1d8ff;border-radius:30px;padding:30px;text-align:center;box-shadow:0 15px 40px #4d2bb510}
.hero .emoji{font-size:54px}.hero h1{font-size:clamp(36px,5vw,64px);margin:8px 0;color:#30265e}.hero p{max-width:780px;margin:0 auto;color:var(--muted);font-size:18px;line-height:1.5}
.date{display:inline-block;margin-top:14px;background:#fff;border:2px solid #e1d8ff;padding:8px 14px;border-radius:999px;font-weight:900;color:var(--purple)}
.toolbar{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:18px 0}.toolbar select,.toolbar button{border:2px solid #ddd4f5;background:#fff;border-radius:999px;padding:10px 15px;font-weight:900;color:var(--ink);cursor:pointer}.toolbar button.active{background:var(--purple);color:#fff}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:18px 0}.stat{background:#fff;border:1px solid #e7e0f4;border-radius:20px;padding:16px;text-align:center}.stat b{display:block;font-size:28px;color:var(--purple)}.stat span{font-size:12px;color:var(--muted);font-weight:800}
.layout{display:grid;grid-template-columns:1.5fr .8fr;gap:16px}.panel{background:var(--card);border:1px solid #e5ddf5;border-radius:24px;padding:20px;box-shadow:0 8px 28px #3920700a}.panel h2{margin-top:0}
.challenge{border:2px solid #e9e2f8;border-radius:20px;padding:17px;margin:12px 0;display:grid;grid-template-columns:54px 1fr auto;gap:14px;align-items:center;transition:.2s}.challenge.done{background:#effcf6;border-color:#a9e7ca}.challenge .icon{font-size:32px;text-align:center}.challenge h3{margin:0 0 5px;font-size:17px}.challenge p{margin:0;color:var(--muted);font-size:13px;line-height:1.4}.points{font-weight:1000;color:var(--orange);font-size:13px;white-space:nowrap}.check{width:43px;height:43px;border-radius:50%;border:3px solid #d9d1ee;background:#fff;font-size:22px;cursor:pointer}.done .check{background:var(--green);border-color:var(--green);color:#fff}
.badges{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.badge{border:1px solid #e7e0f4;border-radius:18px;padding:13px;text-align:center;background:#faf9ff;opacity:.45}.badge.earned{opacity:1;background:#fff8df;border-color:#f0d27a}.badge .bemoji{font-size:32px}.badge b{display:block;font-size:13px;margin-top:5px}.badge small{color:var(--muted)}
.progress{height:13px;border-radius:999px;background:#eee9fa;overflow:hidden}.progress>i{display:block;height:100%;width:0;background:linear-gradient(90deg,#7655ff,#f43b83);border-radius:999px;transition:.35s}
.notice{padding:13px 15px;border-radius:16px;background:#eef9ff;border:1px solid #bfe6fa;color:#245c7d;font-weight:800;font-size:13px;margin-top:14px}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.primary,.secondary{border:0;border-radius:13px;padding:11px 14px;font-weight:900;cursor:pointer}.primary{background:var(--purple);color:#fff}.secondary{background:#f1edff;color:var(--purple)}
.footer{text-align:center;color:var(--muted);font-size:11px;margin-top:30px}
@media(max-width:900px){.layout{grid-template-columns:1fr}.stats{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.navin{align-items:flex-start}.navlinks{display:none}.wrap{padding:16px 12px 50px}.hero{padding:22px 15px}.challenge{grid-template-columns:42px 1fr}.points{grid-column:2}.challenge .check{grid-column:3;grid-row:1/3}}
@media print{.top,.nav,.toolbar,.actions{display:none}.hero{box-shadow:none}.wrap{padding:0}.panel{box-shadow:none}}
