*{box-sizing:border-box}body{margin:0}img{max-width:100%}:root{--color-brand:#0078d4;--color-brand-hover:#106ebe;--color-brand-light:#deecf9;--color-bg:#f6f6f6;--color-surface:#fff;--color-surface-raised:#fff;--color-border:#e1e1e1;--color-border-light:#f0f0f0;--color-text:#1b1b1b;--color-text-secondary:#616161;--color-text-link:#0078d4;--sidebar-bg:#fff;--sidebar-width:280px;--nav-item-hover:#f3f3f3;--nav-item-active-bg:#deecf9;--nav-item-active-text:#0078d4;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--shadow-card:0 1px 3px #00000014, 0 1px 2px #0000000f;--shadow-modal:0 8px 30px #00000026;--transition:.15s ease;--font-sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, sans-serif}[data-theme=dark]{--color-brand:#4aa3e0;--color-brand-hover:#5ba8df;--color-brand-light:#1d3a54;--color-bg:#1a1a1a;--color-surface:#242424;--color-surface-raised:#2d2d2d;--color-border:#3a3a3a;--color-border-light:#2f2f2f;--color-text:#f0f0f0;--color-text-secondary:#a0a0a0;--color-text-link:#4aa3e0;--sidebar-bg:#1e1e1e;--nav-item-hover:#2a2a2a;--nav-item-active-bg:#1d3a54;--nav-item-active-text:#4aa3e0;--shadow-card:0 1px 3px #0000004d;--shadow-modal:0 8px 30px #00000080}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{font-family:var(--font-sans);color:var(--color-text);background:var(--color-bg);transition:background var(--transition), color var(--transition);font-size:16px;line-height:1.5}body{min-height:100vh}a{color:var(--color-text-link);text-decoration:none}a:hover{text-decoration:underline}button{cursor:pointer;font-family:inherit}.app{min-height:100vh;display:flex;position:relative}.sidebar-wrapper{width:var(--sidebar-width);flex-shrink:0;height:100vh;position:sticky;top:0;overflow-y:auto}.main-content{flex:1;min-width:0;max-width:900px;padding:2rem 2.5rem}.sidebar{width:var(--sidebar-width);background:var(--sidebar-bg);border-right:1px solid var(--color-border);flex-direction:column;height:100%;display:flex}.sidebar-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:1.25rem 1rem;display:flex}.sidebar-logo{align-items:center;gap:.5rem;display:flex}.logo-icon{color:var(--color-brand)}.logo-text{color:var(--color-text);letter-spacing:-.02em;font-size:1.2rem;font-weight:700}.sidebar-header-actions{align-items:center;gap:.5rem;display:flex}.online-indicator{color:#107c10}.offline-indicator{color:#d83b01}.sidebar-nav{flex:1;padding:.75rem .5rem;overflow-y:auto}.nav-item{border-radius:var(--radius-sm);width:100%;color:var(--color-text);text-align:left;transition:background var(--transition);cursor:pointer;background:0 0;border:none;align-items:center;gap:.6rem;padding:.55rem .75rem;font-size:.9rem;display:flex}.nav-item:hover{background:var(--nav-item-hover)}.nav-item--active{color:var(--nav-item-active-text);font-weight:600;background:var(--nav-item-active-bg)!important}.sidebar-section{margin-top:1.25rem}.sidebar-section-header{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-secondary);justify-content:space-between;align-items:center;margin-bottom:.25rem;padding:.25rem .75rem;font-size:.75rem;font-weight:600;display:flex}.sidebar-empty{color:var(--color-text-secondary);padding:.5rem .75rem;font-size:.85rem}.feed-item-wrapper{position:relative}.feed-nav-item{padding-right:.25rem}.feed-title{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.feed-icon{color:var(--color-brand);flex-shrink:0}.feed-actions{opacity:0;transition:opacity var(--transition);gap:.1rem;display:flex}.feed-nav-item:hover .feed-actions{opacity:1}.feed-action-btn{color:var(--color-text-secondary)!important;padding:.15rem!important}.feed-action-btn:hover{color:var(--color-text)!important}.feed-action-btn--danger:hover{color:#d83b01!important}.feed-tags-inline{flex-wrap:wrap;gap:.25rem;padding:.1rem .75rem .35rem 2.5rem;display:flex}.tag-dot{color:var(--color-brand);font-size:.85rem}.icon-btn{color:var(--color-text-secondary);border-radius:var(--radius-sm);transition:background var(--transition), color var(--transition);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;padding:.35rem;display:inline-flex}.icon-btn:hover{background:var(--nav-item-hover);color:var(--color-text)}.tag{background:var(--color-border-light);border:1px solid var(--color-border);color:var(--color-text-secondary);white-space:nowrap;border-radius:999px;align-items:center;gap:.2rem;padding:.15rem .55rem;font-size:.75rem;display:inline-flex}.tag-clickable{cursor:pointer;background:var(--color-border-light);transition:background var(--transition), color var(--transition);border:none}.tag-clickable:hover,.tag--active{background:var(--color-brand-light);color:var(--color-brand);font-weight:600}.tag-remove{cursor:pointer;color:inherit;opacity:.6;background:0 0;border:none;align-items:center;padding:0;display:inline-flex}.tag-remove:hover{opacity:1}.article-list-container{max-width:760px}.feed-heading{color:var(--color-text);letter-spacing:-.02em;margin-bottom:1.5rem;font-size:1.6rem;font-weight:700}.article-list{flex-direction:column;gap:1px;display:flex}.article-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);box-shadow:var(--shadow-card);transition:box-shadow var(--transition), transform var(--transition);gap:1rem;margin-bottom:.75rem;padding:1.25rem;display:flex;overflow:hidden}.article-card:hover{transform:translateY(-1px);box-shadow:0 4px 12px #0000001f}.article-image{border-radius:var(--radius-sm);flex-shrink:0;width:120px;height:90px;overflow:hidden}.article-image img{object-fit:cover;width:100%;height:100%}.article-content{flex:1;min-width:0}.article-meta{color:var(--color-text-secondary);flex-wrap:wrap;align-items:center;gap:.35rem;margin-bottom:.5rem;font-size:.78rem;display:flex}.article-feed-name{color:var(--color-brand);font-weight:600}.article-separator{opacity:.4}.article-time,.article-author{align-items:center;gap:.2rem;display:inline-flex}.article-title{margin-bottom:.4rem;font-size:1rem;font-weight:600;line-height:1.4}.article-link{color:var(--color-text);text-decoration:none}.article-link:hover{color:var(--color-brand);text-decoration:underline}.article-description{color:var(--color-text-secondary);-webkit-line-clamp:3;-webkit-box-orient:vertical;margin-bottom:.6rem;font-size:.875rem;line-height:1.55;display:-webkit-box;overflow:hidden}.article-read-more{color:var(--color-brand);align-items:center;gap:.25rem;font-size:.8rem;font-weight:500;display:inline-flex}.article-read-more:hover{text-decoration:underline}.empty-state,.error-state{text-align:center;color:var(--color-text-secondary);padding:3rem 1rem}.empty-state p:first-child,.error-state p:first-child{color:var(--color-text);margin-bottom:.5rem;font-size:1.1rem;font-weight:500}.skeleton-list{flex-direction:column;gap:.75rem;display:flex}.skeleton-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:1.25rem}.skeleton{background:linear-gradient(90deg, var(--color-border) 25%, var(--color-border-light) 50%, var(--color-border) 75%);border-radius:var(--radius-sm);background-size:200% 100%;height:14px;margin-bottom:.6rem;animation:1.5s infinite shimmer}.skeleton-short{width:40%}.skeleton-medium{width:70%}.skeleton-line{width:100%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.modal-overlay{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);z-index:1000;background:#00000080;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:var(--color-surface-raised);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);width:100%;max-width:480px;animation:.2s slideUp}@keyframes slideUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.modal-header{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:1.25rem 1.5rem;display:flex}.modal-title-group{color:var(--color-brand);align-items:center;gap:.6rem;display:flex}.modal-title-group h2{color:var(--color-text);font-size:1.05rem;font-weight:700}.modal-body{flex-direction:column;gap:1.25rem;padding:1.5rem;display:flex}.modal-actions{justify-content:flex-end;gap:.75rem;display:flex}.form-group{flex-direction:column;gap:.4rem;display:flex}.form-group label{color:var(--color-text);font-size:.875rem;font-weight:600}.form-input{border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);width:100%;color:var(--color-text);transition:border-color var(--transition), box-shadow var(--transition);outline:none;padding:.6rem .75rem;font-family:inherit;font-size:.9rem}.form-input:focus{border-color:var(--color-brand);box-shadow:0 0 0 2px var(--color-brand-light)}.tag-input-row{gap:.5rem;display:flex}.tag-input-row .form-input{flex:1}.tags-list{flex-wrap:wrap;gap:.4rem;min-height:1.5rem;margin-top:.5rem;display:flex}.btn-primary{background:var(--color-brand);color:#fff;border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition);border:none;align-items:center;gap:.35rem;padding:.55rem 1.25rem;font-size:.9rem;font-weight:600;display:inline-flex}.btn-primary:hover:not(:disabled){background:var(--color-brand-hover)}.btn-primary:disabled{opacity:.6;cursor:not-allowed}.btn-secondary{color:var(--color-text);border:1px solid var(--color-border);border-radius:var(--radius-sm);cursor:pointer;transition:background var(--transition);background:0 0;align-items:center;gap:.35rem;padding:.55rem 1.25rem;font-size:.9rem;font-weight:500;display:inline-flex}.btn-secondary:hover{background:var(--nav-item-hover)}.error-msg{color:#d83b01;border-radius:var(--radius-sm);background:#fde7e9;border:1px solid #f4acb7;padding:.5rem .75rem;font-size:.85rem}[data-theme=dark] .error-msg{background:#3a1a1a;border-color:#7a3030}.text-secondary{color:var(--color-text-secondary)}.text-sm{font-size:.85rem}.mobile-menu-btn{z-index:200;background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-sm);box-shadow:var(--shadow-card);cursor:pointer;flex-direction:column;gap:4px;padding:.5rem;display:none;position:fixed;top:1rem;left:1rem}.hamburger-line{background:var(--color-text);border-radius:1px;width:20px;height:2px;display:block}.sidebar-overlay{z-index:150;background:#00000080;display:none;position:fixed;inset:0}.add-feed-btn{color:var(--color-brand)!important}@media (width<=768px){.mobile-menu-btn{display:flex}.sidebar-overlay{display:block}.sidebar-wrapper{z-index:160;height:100vh;width:var(--sidebar-width);transition:transform .25s;position:fixed;top:0;left:0;transform:translate(-100%)}.sidebar-wrapper--open{transform:translate(0)}.main-content{padding:4rem 1rem 1.25rem}.article-card{flex-direction:column}.article-image{width:100%;height:180px}}.sidebar-user{border-bottom:1px solid var(--color-border);justify-content:space-between;align-items:center;padding:.5rem 1rem;font-size:.82rem;display:flex}.sidebar-user-name{text-overflow:ellipsis;white-space:nowrap;color:var(--color-text-secondary);overflow:hidden}.landing{background:var(--color-bg);flex-direction:column;min-height:100vh;display:flex}.landing-header{border-bottom:1px solid var(--color-border);background:var(--color-surface);justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}.landing-logo{align-items:center;gap:.5rem;display:flex}.landing-header-actions{align-items:center;gap:.75rem;display:flex}.landing-hero{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;max-width:640px;margin:0 auto;padding:4rem 1.5rem 2rem;display:flex}.landing-title{letter-spacing:-.03em;color:var(--color-text);margin-bottom:1rem;font-size:2.8rem;font-weight:800;line-height:1.15}.landing-subtitle{color:var(--color-text-secondary);margin-bottom:2rem;font-size:1.15rem;line-height:1.6}.btn-lg{border-radius:var(--radius-md);padding:.75rem 2rem;font-size:1.05rem}.landing-features{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.5rem;width:100%;max-width:960px;margin:0 auto;padding:2rem 2rem 4rem;display:grid}.feature-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);text-align:center;padding:1.5rem}.feature-icon{color:var(--color-brand);margin-bottom:.75rem}.feature-card h3{color:var(--color-text);margin-bottom:.5rem;font-size:1rem;font-weight:700}.feature-card p{color:var(--color-text-secondary);font-size:.9rem;line-height:1.5}.landing-footer{text-align:center;color:var(--color-text-secondary);border-top:1px solid var(--color-border);padding:1.5rem;font-size:.82rem}@media (width<=768px){.landing-title{font-size:2rem}.landing-hero{padding:2.5rem 1rem 1.5rem}}