:root{--bg:#f4f5f9;--card:#fff;--border:#e8e8ec;--text:#222;--text2:#666;--text3:#999;--blue:#3b5998;--blue-bg:#eef2ff;--green:#1a7f37;--green-bg:#e6f9ed;--orange:#c2410c;--orange-bg:#fff5eb;--red:#c33;--red-bg:#fde8e8;--purple:#7c3aed;--purple-bg:#f3eeff;--tag:#f0f1f5}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased}.topbar{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--border);padding:10px 16px}.topbar-inner{max-width:1200px;margin:0 auto;display:flex;align-items:center;gap:12px}.logo{font-size:1.1rem;font-weight:800;color:var(--text);white-space:nowrap}.logo span{color:var(--blue)}.search{flex:1;position:relative;max-width:480px}.search input{width:100%;padding:8px 12px 8px 32px;border:1px solid var(--border);border-radius:20px;font-size:.85rem;outline:none;background:var(--bg);transition:border .2s}.search input:focus{border-color:var(--blue);background:#fff}.search-icon{position:absolute;left:10px;top:50%;transform:translateY(-50%);color:var(--text3);font-size:.8rem}.topbar-stats{font-size:.72rem;color:var(--text3);white-space:nowrap}.topbar-stats b{color:var(--blue)}.nav-wrap{background:#fff;border-bottom:1px solid var(--border);overflow-x:auto;-webkit-overflow-scrolling:touch;position:relative}.nav-wrap::-webkit-scrollbar{display:none}.nav-wrap::after{content:'';position:absolute;top:0;right:0;bottom:0;width:32px;background:linear-gradient(to right,transparent,#fff);pointer-events:none}.nav{max-width:1200px;margin:0 auto;display:flex;gap:4px;padding:8px 16px;white-space:nowrap}.nav-chip{padding:5px 14px;border-radius:16px;font-size:.78rem;color:var(--text2);background:var(--tag);border:none;cursor:pointer;transition:all .15s}.nav-chip:hover{background:var(--blue-bg);color:var(--blue)}.nav-chip.on{background:var(--blue);color:#fff}.filter-bar{max-width:1200px;margin:12px auto 0;padding:0 16px;display:flex;gap:6px;flex-wrap:wrap;align-items:center}.fsel{padding:4px 10px;border:1px solid var(--border);border-radius:6px;font-size:.72rem;color:var(--text2);background:#fff;outline:none;cursor:pointer}.fsel:focus{border-color:var(--blue)}.fsort{margin-left:auto;display:flex;gap:4px}.fsort button{padding:4px 10px;border:1px solid var(--border);border-radius:5px;font-size:.7rem;color:var(--text2);background:#fff;cursor:pointer}.fsort button:hover{border-color:var(--blue);color:var(--blue)}.fsort button.on{background:var(--blue);color:#fff;border-color:var(--blue)}.export-btn{padding:4px 10px;border:1px solid var(--border);border-radius:5px;font-size:.7rem;color:var(--text2);background:#fff;cursor:pointer}.export-btn:hover{color:var(--green);border-color:var(--green)}.main{max-width:1200px;margin:0 auto;padding:12px 16px 60px}.result-info{font-size:.72rem;color:var(--text3);margin-bottom:10px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}.card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px 14px;transition:box-shadow .15s,transform .15s;display:flex;flex-direction:column}.card:hover{box-shadow:0 2px 12px rgba(0,0,0,.07);transform:translateY(-1px)}.c-head{display:flex;align-items:center;gap:8px;margin-bottom:6px}.c-icon{width:32px;height:32px;border-radius:8px;background:var(--tag);display:flex;align-items:center;justify-content:center;font-size:.75rem;font-weight:700;color:var(--blue);flex-shrink:0;text-transform:uppercase}.c-info{flex:1;min-width:0}.c-name{font-size:.82rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.c-name a{color:var(--text);text-decoration:none}.c-name a:hover{color:var(--blue)}.c-url{font-size:.62rem;color:var(--text3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.c-tags{display:flex;flex-wrap:wrap;gap:3px;margin:6px 0}.ct{font-size:.6rem;padding:2px 6px;border-radius:3px;font-weight:500}.ct-sec{font-size:.55rem;padding:1px 5px;opacity:.75}@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}.sk-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:12px 14px}.sk-line{height:10px;border-radius:5px;background:linear-gradient(90deg,var(--tag) 25%,#e8e8ec 50%,var(--tag) 75%);background-size:800px 100%;animation:shimmer 1.5s infinite}.sk-w60{width:60%}.sk-w40{width:40%}.sk-w80{width:80%}.sk-mt8{margin-top:8px}.sk-mt6{margin-top:6px}.ct-type{background:var(--purple-bg);color:var(--purple)}.ct-t1{background:var(--green-bg);color:var(--green)}.ct-t2{background:var(--blue-bg);color:var(--blue)}.ct-t3{background:var(--tag);color:var(--text3)}.ct-df-y{background:var(--green-bg);color:var(--green)}.ct-df-n{background:var(--red-bg);color:var(--red)}.ct-df-m{background:var(--orange-bg);color:var(--orange)}.ct-df-u{background:var(--tag);color:var(--text3)}.ct-free{background:var(--green-bg);color:var(--green)}.ct-paid{background:var(--orange-bg);color:var(--orange)}.ct-lang{background:#e8f4fd;color:#0891b2}.dr-h{background:var(--green-bg);color:var(--green);font-weight:700}.dr-m{background:var(--blue-bg);color:var(--blue);font-weight:600}.dr-l{background:var(--orange-bg);color:var(--orange)}.dr-n{background:var(--tag);color:var(--text3)}.c-desc{font-size:.72rem;color:var(--text2);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:auto}.c-ease{margin-top:6px;display:flex;align-items:center;gap:6px}.c-ease .eb{flex:1;height:3px;background:var(--tag);border-radius:2px;overflow:hidden}.c-ease .ef{height:100%;border-radius:2px}.ef.easy{background:var(--green)}.ef.mid{background:var(--orange)}.ef.hard{background:var(--red)}.c-ease .el{font-size:.55rem;color:var(--text3);min-width:36px}.pager{display:flex;justify-content:center;align-items:center;gap:12px;margin-top:20px}.pager button{padding:8px 20px;border:1px solid var(--border);border-radius:8px;background:var(--card);color:var(--text2);font-size:.82rem;cursor:pointer}.pager button:hover{border-color:var(--blue);color:var(--blue)}.pager button:disabled{opacity:.3;cursor:default}.pager .pi{font-size:.75rem;color:var(--text3)}.foot{text-align:center;padding:20px 16px;color:var(--text3);font-size:.68rem;border-top:1px solid var(--border);background:#fff}@media(max-width:768px){.topbar-inner{flex-wrap:wrap;gap:8px}.search{order:3;max-width:100%;flex-basis:100%}.topbar-stats{display:none}.grid{grid-template-columns:1fr 1fr;gap:8px}.card{padding:10px 12px}.c-icon{width:28px;height:28px;font-size:.65rem}.c-desc{-webkit-line-clamp:1}}@media(max-width:480px){.grid{grid-template-columns:1fr}.filter-bar{gap:4px}.fsort{margin-left:0;width:100%;justify-content:flex-start;overflow-x:auto}.nav{padding:6px 12px}}