:root{--primary:#2f7df6;--bg:#f5f7fb;--text:#111827;--muted:#6b7280;--card:#ffffff;--shadow:0 8px 24px rgba(0,0,0,.08)}*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text)}a{text-decoration:none;color:inherit}img{max-width:100%;display:block}.container{max-width:480px;margin:0 auto;min-height:100vh;background:var(--bg)}.topbar{position:sticky;top:0;z-index:20;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(0,0,0,.06)}.brand{font-weight:800;letter-spacing:.5px;color:#1f4fd6;font-size:18px}.top-icons{display:flex;gap:14px;align-items:center;color:#111827}.icon{width:20px;height:20px;opacity:.85}.content{padding-bottom:72px}.tabs{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid rgba(0,0,0,.06);display:flex;justify-content:space-around;z-index:30;padding:8px 0}.tab{display:flex;flex-direction:column;align-items:center;gap:4px;font-size:12px;color:#4b5563;width:25%}.tab svg{width:22px;height:22px}.tab.active{color:var(--primary)}.card{background:var(--card);border-radius:14px;box-shadow:var(--shadow)}.section{padding:14px}.hero{margin:12px 12px 0;border-radius:16px;overflow:hidden;position:relative}.hero .hero-img{height:160px;object-fit:cover;width:100%}.hero .hero-mask{position:absolute;left:0;right:0;bottom:0;padding:14px;background:linear-gradient(180deg,rgba(0,0,0,0) 0,rgba(0,0,0,.6) 70%);color:#fff}.hero .hero-title{font-size:18px;font-weight:800}.hero .hero-sub{font-size:12px;opacity:.9;margin-top:6px}.dots{position:absolute;right:10px;bottom:10px;display:flex;gap:6px}.dot{width:7px;height:7px;border-radius:999px;background:rgba(255,255,255,.5)}.dot.active{background:#fff}.category{display:flex;justify-content:space-between;gap:10px;padding:14px 10px;margin:10px 12px 0}.cat-item{flex:1;background:transparent;border-radius:0;padding:0;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:none}.cat-icon{width:38px;height:38px;border-radius:14px;display:grid;place-items:center}.cat-icon.blue{background:#dbeafe;color:#1d4ed8}.cat-icon.green{background:#dcfce7;color:#047857}.cat-icon.purple{background:#ede9fe;color:#6d28d9}.cat-icon.orange{background:#ffedd5;color:#c2410c}.cat-label{font-size:12px;color:#111827;font-weight:700}.section-title{display:flex;align-items:center;justify-content:space-between;margin:14px 12px 10px}.section-title h3{margin:0;font-size:18px}.section-title a{color:var(--primary);font-size:13px}.course{margin:0 12px 14px;overflow:hidden}.course .cover{height:150px;object-fit:cover;width:100%}.course .body{padding:12px}.course .badge{position:absolute;right:10px;top:10px;background:rgba(59,130,246,.95);color:#fff;font-size:12px;padding:4px 10px;border-radius:999px}.course-wrap{position:relative}.stars{color:#f59e0b;font-size:13px}.meta{color:var(--muted);font-size:12px;margin-top:6px}.title{margin:8px 0 0;font-weight:800;font-size:16px;line-height:1.3}.vip-hero{margin:0;background:linear-gradient(180deg,#3b82f6 0,#7c3aed 100%);color:#fff;padding:22px 16px 18px}.vip-hero h2{margin:0;font-size:20px}.vip-hero p{margin:10px 0 0;font-size:13px;opacity:.95;line-height:1.5}.vip-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}.vip-item{background:rgba(255,255,255,.16);border-radius:14px;padding:12px;display:flex;gap:10px;align-items:center}.vip-item .mini{width:34px;height:34px;border-radius:12px;background:rgba(255,255,255,.22);display:grid;place-items:center}.plan{margin:12px;background:#fff;border-radius:16px;overflow:hidden}.plan .plan-body{padding:14px}.price{font-size:28px;font-weight:900}.price small{font-size:14px;color:#6b7280;font-weight:600}.check{display:flex;align-items:center;gap:8px;color:#374151;font-size:13px;margin-top:10px}.me-top{background:linear-gradient(180deg,#3b82f6 0,#2563eb 60%,#eef2ff 60%);padding:18px 12px 0}.me-card{background:#fff;border-radius:16px;box-shadow:var(--shadow);padding:14px;display:flex;gap:12px;align-items:center}.avatar{width:60px;height:60px;border-radius:999px;overflow:hidden;background:#e5e7eb}.me-info{flex:1}.me-name{font-weight:900;font-size:18px}.me-sub{font-size:12px;color:#6b7280;margin-top:6px}.me-btn{background:rgba(255,255,255,.25);border:1px solid rgba(255,255,255,.45);color:#fff;border-radius:999px;padding:8px 12px;font-size:13px;display:inline-flex;align-items:center;gap:8px}.stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;margin:12px 12px 0}.stat{background:#fff;border-radius:14px;box-shadow:0 8px 18px rgba(0,0,0,.05);padding:14px;text-align:center}.stat .num{font-size:22px;font-weight:900}.stat .lbl{font-size:12px;color:#6b7280;margin-top:4px}.list{margin:12px;background:#fff;border-radius:16px;overflow:hidden}.list .row{display:flex;align-items:center;justify-content:space-between;padding:14px 14px;border-top:1px solid rgba(0,0,0,.06)}.list .row:first-child{border-top:none}.row .left{display:flex;align-items:center;gap:10px}.row .left .bubble{width:32px;height:32px;border-radius:12px;background:#eef2ff;color:#2563eb;display:grid;place-items:center}.row .sub{font-size:12px;color:#6b7280;margin-top:2px}.row .text{display:flex;flex-direction:column}.arrow{opacity:.5}