*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#f2f2f7;--surface:#fff;--text:#1c1c1e;--sub:#8e8e93;--border:#e5e5ea;--accent:#0063b0;--radius:12px;--header-h:52px;--tabs-h:44px}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Hiragino Sans,sans-serif}#root{max-width:480px;min-height:100dvh;margin:0 auto}.app{flex-direction:column;min-height:100dvh;display:flex}.header{z-index:10;height:var(--header-h);background:var(--surface);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:0 16px;display:flex;position:sticky;top:0}.header-title{letter-spacing:-.02em;font-family:SF Pro Display,-apple-system,BlinkMacSystemFont,sans-serif;font-size:22px;font-weight:800}.header-dot{color:#f60}.refresh-btn{cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;font-size:22px;transition:background .15s;display:flex}.refresh-btn:hover{background:var(--bg)}.refresh-btn:disabled{opacity:.4;cursor:default}.tab-bar{top:var(--header-h);z-index:9;height:var(--tabs-h);background:var(--bg);scrollbar-width:none;align-items:flex-end;gap:4px;padding:0 6px;display:flex;position:sticky;overflow-x:auto}.tab-bar::-webkit-scrollbar{display:none}.sn-tab{color:#fff;cursor:pointer;opacity:.7;-webkit-tap-highlight-color:transparent;border:none;border-radius:8px 8px 0 0;flex-shrink:0;height:32px;padding:0 16px;font-size:13px;font-weight:700;transition:opacity .15s,height .15s;position:relative}.sn-tab--active{opacity:1;height:38px;font-size:14px}.sn-tab-label{white-space:nowrap}.feed{flex-direction:column;flex:1;gap:8px;padding:12px;display:flex}.state-msg{color:var(--sub);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;padding:40px 0;font-size:15px;display:flex}.state-msg.error{color:#c0392b}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:28px;height:28px;animation:.7s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.card{background:var(--surface);border-radius:var(--radius);color:inherit;-webkit-tap-highlight-color:transparent;padding:14px;text-decoration:none;transition:transform .1s,box-shadow .1s;display:block;box-shadow:0 1px 3px #0000000f}.card:active{box-shadow:none;transform:scale(.98)}.card{align-items:center;gap:12px;padding:12px;display:flex}.card-body{flex-direction:column;flex:1;gap:8px;min-width:0;display:flex}.card-title{color:var(--text);-webkit-line-clamp:3;-webkit-box-orient:vertical;font-size:14px;font-weight:500;line-height:1.5;display:-webkit-box;overflow:hidden}.card-meta{align-items:center;gap:6px;display:flex}.card-source{font-size:11px;font-weight:600}.card-date{color:var(--sub);font-size:11px}.card-thumb{border-radius:8px;flex-shrink:0;width:80px;height:80px;position:relative;overflow:hidden}.card-thumb-img{object-fit:cover;opacity:0;width:100%;height:100%;transition:opacity .25s;position:absolute;inset:0}.card-thumb-img.loaded{opacity:1}