:root{--ink:#24304a;--muted:#667085;--line:#eadcf2;--pink:#ff67a5;--purple:#8f67ff;--yellow:#ffd43b;--aqua:#22d3c5;--blue:#55a8ff;--coral:#ff7b62;--lime:#a8df45}*{box-sizing:border-box}body{color:var(--ink);background:linear-gradient(#fff7fc,#f4fbff 45%,#fffbea);margin:0;font-family:Inter,system-ui,sans-serif}button,input,textarea,select{font:inherit}.app{max-width:1180px;min-height:100vh;margin:auto;padding-bottom:40px}header{justify-content:space-between;align-items:center;gap:14px;padding:22px 20px 12px;display:flex}.brand{align-items:center;gap:12px;display:flex}.logo{background:linear-gradient(135deg,var(--yellow),var(--pink),var(--purple));border-radius:16px;place-items:center;width:50px;height:50px;font-size:26px;display:grid}.brand h1{margin:0}.brand small,.muted{color:var(--muted)}.header-actions{align-items:center;gap:8px;display:flex}.pill{background:linear-gradient(90deg,#fff4b8,#ffe7f2);border:1px solid #f2d7e5;border-radius:999px;padding:8px 12px;font-size:13px}nav{gap:8px;padding:0 20px 16px;display:flex;overflow:auto}nav button,.secondary{cursor:pointer;white-space:nowrap;background:#fff;border:0;border-radius:12px;padding:10px 14px;box-shadow:0 2px 8px #0000000b}nav button.active{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff}main{padding:0 20px}.hero{border:1px solid var(--line);background:linear-gradient(135deg,#fff0f7,#fff8d8 40%,#e9fffb 70%,#edf5ff);border-radius:26px;grid-template-columns:1.4fr .9fr;align-items:center;gap:20px;padding:26px;display:grid}.hero h2{margin:0 0 10px;font-size:38px;line-height:1.03}.hero p{font-size:17px}.heroCard,.card{border:1px solid var(--line);background:#fff;border-radius:20px;padding:18px;box-shadow:0 4px 14px #00000008}.heroCard{box-shadow:0 10px 28px #00000010}.bigCamera{text-align:center;font-size:58px}.cta{background:linear-gradient(135deg,var(--pink),var(--purple));color:#fff;cursor:pointer;border:0;border-radius:12px;padding:11px 16px;font-weight:700}.grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px;display:grid}.sectionTitle{justify-content:space-between;align-items:center;gap:10px;margin:10px 0 16px;display:flex}.sectionTitle h2{margin:0;font-size:30px}.narrow{max-width:520px;margin:auto}label{margin-top:12px;font-weight:700;display:block}input,textarea,select{border:1px solid var(--line);background:#fff;border-radius:10px;width:100%;margin:6px 0 12px;padding:10px}textarea{min-height:90px}.small{font-size:13px}.smallBtn{padding:7px 9px}.notice{border-left:5px solid var(--purple);background:linear-gradient(90deg,#eef9ff,#f5efff);border-radius:14px;padding:14px}.classGrid{grid-template-columns:280px 1fr;gap:18px;display:grid}.sidebar button{text-align:left;border:1px solid var(--line);cursor:pointer;background:#fff;border-radius:10px;width:100%;margin-bottom:8px;padding:11px}.sidebar button.active{border-color:var(--aqua);background:linear-gradient(90deg,#fff3a8,#e7fff9)}.profile{align-items:center;gap:10px;display:flex}.avatar{background:linear-gradient(135deg,var(--yellow),var(--pink),var(--purple));border-radius:50%;place-items:center;width:44px;height:44px;font-weight:800;display:grid}.challenge{border-top:7px solid var(--aqua)}.challenge:nth-child(2){border-top-color:var(--yellow)}.challenge:nth-child(3){border-top-color:var(--blue)}.challenge:nth-child(4){border-top-color:var(--purple)}.challenge:nth-child(5){border-top-color:var(--coral)}.challenge:nth-child(6){border-top-color:var(--lime)}.badge{background:#effaf7;border-radius:999px;padding:5px 8px;font-size:12px;display:inline-block}.submitBox{margin-bottom:16px}.post{border:1px solid var(--line);background:#fff;border-radius:18px;margin-bottom:16px;overflow:hidden}.postHead{justify-content:space-between;align-items:center;padding:14px;display:flex}.postPhoto{aspect-ratio:4/3;background:#eef2f7;place-items:center;display:grid;overflow:hidden}.postPhoto img{object-fit:cover;width:100%;height:100%}.postBody{padding:14px}.reactions{flex-wrap:wrap;gap:8px;display:flex}.reactions button{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 10px}.comment{background:#fff5fb;border-radius:12px;margin-top:8px;padding:10px 12px}.commentBox{grid-template-columns:1fr auto;gap:8px;margin-top:10px;display:grid}.commentBox input{margin:0}.danger{color:#a33;background:#fff2f2;border:1px solid #ffd1d1;border-radius:10px}table{border-collapse:collapse;width:100%}th,td{border-bottom:1px solid var(--line);text-align:left;padding:11px}@media (width<=860px){.hero,.classGrid{grid-template-columns:1fr}.grid{grid-template-columns:1fr 1fr}}@media (width<=560px){.grid{grid-template-columns:1fr}.hero h2{font-size:31px}.sectionTitle{flex-direction:column;align-items:flex-start}.header-actions{display:none}}