body{color:#333;background-color:#f4f7f6;margin:0;padding:0;font-family:sans-serif;transition:background-color .3s,color .3s}.app-layout{align-items:flex-start;min-height:100vh;display:flex}.sidebar{box-sizing:border-box;-webkit-overflow-scrolling:touch;background:#fff;border-right:1px solid #ddd;flex-shrink:0;width:320px;height:100dvh;padding:20px 20px 100px;transition:background-color .3s,right .3s cubic-bezier(.4,0,.2,1);position:sticky;top:0;overflow-y:auto}.sidebar-section{margin-bottom:25px}.sidebar-section h3,.sidebar-section summary{color:#333;cursor:pointer;border-bottom:2px solid #007bff;outline:none;margin-top:0;margin-bottom:12px;padding-bottom:8px;font-size:1.1em;font-weight:700}.manage-cat-details{margin-bottom:5px}.manage-cat-header{color:#007bff;cursor:pointer;border-bottom:1px solid #eee;outline:none;margin:10px 0 5px;padding-bottom:6px;font-size:.95em;font-weight:700;display:block}.manage-cat-header::-webkit-details-marker{display:none}.manage-cat-header:before{content:"▶";color:#888;margin-right:5px;font-size:.8em;transition:transform .2s;display:inline-block}.manage-cat-details[open]>.manage-cat-header:before{transform:rotate(90deg)}.manage-cat-content{border-left:2px solid #eee;margin-top:10px;margin-bottom:15px;margin-left:5px;padding-left:10px}.filter-category-group{width:100%;margin-bottom:15px}.filter-category-label{color:#666;border-left:3px solid #ccc;margin-bottom:6px;padding-left:6px;font-size:.85em;font-weight:700}.filter-category-buttons{flex-wrap:wrap;gap:6px;display:flex}.category-filters{flex-direction:column;gap:8px;display:flex}.cat-btn,.site-btn{text-align:left;color:#333;cursor:pointer;background-color:#f8f9fa;border:1px solid #0000;border-radius:6px;padding:10px 15px;font-size:.95em;transition:background-color .2s}.cat-btn:hover,.site-btn:hover{background-color:#e2e6ea}.cat-btn.active,.site-btn.active{color:#fff;background-color:#343a40;font-weight:700}.site-btn.active{background-color:#007bff}.bookmark-filter-btn{background-color:#fffaf0;border-color:#ffc107}.add-form-group,.edit-form-group{background:#f8f9fa;border:1px solid #eee;border-radius:6px;flex-direction:column;gap:8px;margin-bottom:10px;padding:12px;display:flex}.add-form-group input,.edit-form-group input{box-sizing:border-box;border:1px solid #ccc;border-radius:4px;width:100%;padding:10px;font-size:.9em}.edit-btn-group{gap:8px;display:flex}.add-btn{color:#fff;cursor:pointer;background-color:#28a745;border:none;border-radius:4px;padding:10px;font-weight:700}.edit-btn{color:#fff;cursor:pointer;background-color:#17a2b8;border:none;border-radius:4px;flex:1;padding:8px;font-weight:700}.delete-site-btn{color:#fff;cursor:pointer;background-color:#dc3545;border:none;border-radius:4px;flex:1;padding:8px;font-weight:700}.main-content{box-sizing:border-box;flex-grow:1;width:100%;max-width:900px;margin:0 auto;padding:25px}.header-action{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:20px;display:flex}.header-action h2{margin:0;font-size:1.8em}.desktop-header{border-bottom:2px solid #ddd;padding-bottom:15px}.message{color:#155724;background-color:#d4edda;border-radius:6px;margin-bottom:15px;padding:12px;font-size:.95em}.toolbar{flex-wrap:wrap;gap:8px;margin-bottom:25px;display:flex}.tool-btn{color:#fff;cursor:pointer;text-align:center;border:none;border-radius:6px;flex:1;min-width:100px;padding:10px 12px;font-size:.9em;font-weight:700;transition:opacity .2s}.tool-btn:hover{opacity:.8}.fetch-btn{cursor:pointer;color:#fff;background-color:#007bff;border:none;border-radius:8px;width:100%;padding:12px 20px;font-size:1.1em;font-weight:700;transition:background .2s,transform .1s;box-shadow:0 2px 5px #007bff4d}.fetch-btn:active{transform:scale(.98)}.fetch-btn:hover{background-color:#0056b3}.date-group{margin-bottom:30px}.date-header{color:#007bff;border-bottom:2px solid #007bff;margin-bottom:15px;padding-bottom:5px;font-size:1.3em}.notification-list{flex-direction:column;gap:12px;display:flex}.notification-card{cursor:pointer;background:#fff;border:1px solid #ddd;border-radius:8px;gap:15px;padding:15px;transition:all .2s;display:flex;position:relative;box-shadow:0 2px 4px #0000000d}.notification-card:hover{border-color:#007bff;transform:translateY(-2px);box-shadow:0 4px 10px #0000001a}.notification-card.is-read{opacity:.6;background-color:#f8f9fa}.card-thumbnail{background-color:#f0f0f0;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:90px;height:90px;display:flex;overflow:hidden}.card-thumbnail img{object-fit:cover;width:100%;height:100%}.card-content{flex-direction:column;flex-grow:1;justify-content:center;display:flex;overflow:hidden}.card-badges{flex-wrap:wrap;align-items:center;gap:6px;margin-bottom:8px;display:flex}.site-badge{color:#fff;background-color:#343a40;border-radius:4px;padding:3px 8px;font-size:.75em}.category-badge{color:#333;background-color:#e9ecef;border-radius:12px;padding:3px 8px;font-size:.75em}.time-badge{color:#856404;background-color:#fff3cd;border:1px solid #ffeeba;border-radius:4px;padding:3px 8px;font-size:.75em;font-weight:700}.bookmark-btn{cursor:pointer;-webkit-user-select:none;user-select:none;padding-right:5px;font-size:1.3em;transition:transform .2s}.bookmark-btn:hover{transform:scale(1.2)}.new-badge{color:#fff;background-color:#dc3545;border-radius:12px;padding:2px 8px;font-size:.75em;font-weight:700;animation:2s infinite pulse;box-shadow:0 0 5px #dc354580}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.card-title{-webkit-line-clamp:3;-webkit-box-orient:vertical;margin:0;font-size:1.05em;font-weight:700;line-height:1.4;display:-webkit-box;overflow:hidden}.card-summary{color:#666;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:6px 0 0;font-size:.85em;line-height:1.5;display:-webkit-box;overflow:hidden}.delete-checkbox-wrapper{justify-content:center;align-items:center;padding-right:10px;display:none}.delete-checkbox-wrapper input{cursor:pointer;width:22px;height:22px}.execute-action-container{z-index:100;gap:10px;margin-top:15px;display:none;position:sticky;bottom:20px}.execute-btn{cursor:pointer;color:#fff;text-align:center;border:none;border-radius:8px;flex:1;padding:15px;font-size:1.1em;font-weight:700;box-shadow:0 4px 10px #0000004d}.execute-read-btn{background-color:#28a745}.execute-delete-btn{background-color:#dc3545}body.select-mode .delete-checkbox-wrapper,body.select-mode .execute-action-container{display:flex}body.select-mode .notification-card{cursor:default}body.select-mode .notification-card:hover{border-color:#ffc107;transform:none}body.select-mode .notification-card.selected{background-color:#ffeeba;border-color:#ffc107}.mobile-header{z-index:90;background:#fff;border-bottom:1px solid #ddd;justify-content:space-between;align-items:center;padding:15px 20px;display:none;position:sticky;top:0;box-shadow:0 2px 4px #0000000d}.mobile-header h2{color:#007bff;margin:0;font-size:1.4em}.menu-toggle-btn{color:#333;cursor:pointer;background:0 0;border:1px solid #ccc;border-radius:4px;padding:6px 12px;font-size:1.2em}.sidebar-close-btn-wrapper{text-align:right;border-bottom:1px solid #eee;margin-bottom:15px;padding-bottom:10px;display:none}.sidebar-close-btn{color:#666;cursor:pointer;background:0 0;border:none;padding:0 10px;font-size:2.2em;line-height:1}.sidebar-overlay{z-index:99;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0009;width:100%;height:100%;display:none;position:fixed;top:0;left:0}.mobile-update-wrapper{margin-bottom:20px;display:none}@media (width<=800px){.app-layout{flex-direction:column}.desktop-header{display:none}.mobile-header{display:flex}.mobile-update-wrapper{display:block}.main-content{background:#fff;padding:15px}.sidebar{z-index:100;border-left:1px solid #ddd;border-right:none;width:85%;max-width:360px;position:fixed;top:0;left:auto;right:-100%;box-shadow:-2px 0 15px #0000004d}.sidebar.open{left:auto;right:0}.sidebar-overlay.open{display:block}.sidebar-close-btn-wrapper{text-align:left;display:block}.toolbar{gap:8px}.tool-btn{flex-basis:48%;min-width:0;padding:10px 8px;font-size:.85em}.card-thumbnail{width:80px;height:80px}}body.dark-mode{color:#e0e0e0;background-color:#121212}body.dark-mode .sidebar{background:#1e1e1e;border-left-color:#333;border-right-color:#333}body.dark-mode .main-content{background:#121212}@media (width<=800px){body.dark-mode .main-content{background:#1e1e1e}}body.dark-mode .mobile-header{background:#1e1e1e;border-bottom-color:#333;box-shadow:0 2px 4px #0003}body.dark-mode .mobile-header h2{color:#4dabf7}body.dark-mode .menu-toggle-btn{color:#e0e0e0;border-color:#555}body.dark-mode .desktop-header{border-bottom-color:#333}body.dark-mode .sidebar-section h3,body.dark-mode .sidebar-section summary{color:#fff;border-bottom-color:#4dabf7}body.dark-mode .sidebar-close-btn-wrapper{border-bottom-color:#444}body.dark-mode .sidebar-close-btn{color:#aaa}body.dark-mode .manage-cat-header{color:#4dabf7;border-bottom-color:#444}body.dark-mode .manage-cat-header:before{color:#888}body.dark-mode .manage-cat-content{border-left-color:#444}body.dark-mode .filter-category-label{color:#aaa;border-left-color:#555}body.dark-mode .cat-btn,body.dark-mode .site-btn{color:#ccc;background-color:#2a2a2a;border-color:#0000}body.dark-mode .cat-btn:hover,body.dark-mode .site-btn:hover{background-color:#3a3a3a}body.dark-mode .cat-btn.active,body.dark-mode .site-btn.active{color:#fff;background-color:#007bff}body.dark-mode .bookmark-filter-btn{color:#e0e0e0;background-color:#332a00;border-color:#b38600}body.dark-mode .add-form-group,body.dark-mode .edit-form-group{background:#252525;border-color:#444}body.dark-mode input{color:#e0e0e0;background-color:#333;border-color:#555}body.dark-mode input::placeholder{color:#888}body.dark-mode .notification-card{background:#252525;border-color:#444}body.dark-mode .notification-card:hover{background:#2a2a2a;border-color:#007bff}body.dark-mode .card-title{color:#fff}body.dark-mode .card-summary{color:#aaa}body.dark-mode .notification-card.is-read{opacity:1;background-color:#1a1a1a}body.dark-mode .notification-card.is-read .card-title{color:#888}body.dark-mode .card-thumbnail{background-color:#333}body.dark-mode .site-badge{color:#f8f9fa;background-color:#495057}body.dark-mode .category-badge{color:#e0e0e0;background-color:#444}body.dark-mode .time-badge{color:#ffdb58;background-color:#3a2e05;border-color:#735a0b}body.dark-mode .message{color:#8fdfa9;background-color:#1e3a28}body.dark-mode .date-header{color:#4dabf7;border-bottom-color:#4dabf7}