:root{--bg-1:#f5f6f9;--primary:#4361ee;--secondary:#3f37c9;--accent:#f72585;--light:#f8f9fa;--dark:#212529;--gray:#6c757d;--light-bg:#fff;--dark-bg:#121212;--card-light:#fff;--card-dark:#1e1e1e;--text-light:#333;--text-dark:#f0f0f0;--shadow:0 4px 20px rgba(0,0,0,0.08)}
[data-theme="dark"]{--light-bg:var(--dark-bg);--card-light:var(--card-dark);--text-light:var(--text-dark)}
*{margin:0;padding:0;box-sizing:border-box;font-family:'Segoe UI',Tahoma,Geneva,Verdana,sans-serif}
body{background:#f5f7fa;color:var(--text-light);line-height:1.6;min-height:100vh;display:flex;flex-direction:column}
.jrno{display:none}
.navbar{position:fixed;top:0;width:100%;background:rgba(255,255,255,0.95);box-shadow:var(--shadow);z-index:1000;display:flex;justify-content:space-between;align-items:center;padding:15px 5%;transition:var(--transition);backdrop-filter:blur(10px)}
.fa-arrow-up{color:#f7f7f7}
.navbar.scrolled{padding:6px 5%}
.jrhz-logo{width:120px;height:32px;font-size:26px;text-decoration:none;background:url('../images/logo.png');background-size:contain;background-position:center}
.jrhz-logo span{display:none;font-size:26px;font-weight:700;color:var(--text-light);text-decoration:none;align-items:center;gap:10px}
.nav-icons{display:flex;gap:20px;align-items:center}
.nav-icon{width:40px;height:40px;border-radius:50%;background:rgba(67,97,238,0.1);display:flex;justify-content:center;align-items:center;cursor:pointer;transition:var(--transition);font-size:18px;text-decoration:none;color:var(--primary)}
.nav-icon img{width:38px;height:38px;border-radius:50%;background:rgba(67,97,238,0.1)}
.nav-icon:hover{background:rgba(67,97,238,0.2);transform:translateY(-2px)}
.nav-icon .fas{color:#48494b}
.theme-toggle-container{display:flex;justify-content:center;margin:0rem 0}
.theme-toggle{display:flex;align-items:center;padding:5px 10px;border-radius:30px;cursor:pointer;user-select:none;background:rgba(67,97,238,0.1);border:2px solid transparent}
.theme-toggle:hover{transform:translateY(-2px);background:rgba(67,97,238,0.2)}
.theme-toggle:active{transform:translateY(1px)}
.theme-toggle i{font-size:1.2rem;margin-right:10px;color:#48494b}
.theme-toggle span{font-weight:600;color:var(--text-light)}
.dropdown{position:absolute;background:var(--card-light);border-radius:18px;box-shadow:var(--shadow);z-index:100;opacity:0;visibility:hidden;transform:translateY(10px);transition:var(--transition)}
.dropdown span{color:var(--gray);font-weight:400;font-size:15px}
.dropdown.active{opacity:1;visibility:visible;transform:translateY(0)}
.menu-dropdown{top:60px;right:0;width:370px}
.user-dropdown{right:2px}
.dropdown h3{color:var(--primary);margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid rgba(0,0,0,0.1)}
.dropdown ul{top:60px;list-style:none;padding:15px}
.dropdown li{padding:8px 0;border-bottom:1px solid rgba(0,0,0,0.2);display:flex;align-items:center}
.dropdown a{text-decoration:none;color:var(--text-light);display:flex;align-items:center;transition:var(--transition);padding:6px 8px;border-radius:6px}
.dropdown a:hover{background:rgba(67,97,238,0.1);color:var(--primary)}
.dropdown i{margin-right:10px;width:20px;text-align:center}
.menu-dropdowntop{position:absolute;top:60px;right:0}
.menu-dropdowntop a{width:100%;text-decoration:none;color:var(--text-light);display:inline-block;align-items:center;padding:1px 8px;height:2rem;line-height:2rem;font-size:1.1rem}
.auto-wrap-list{display:flex;flex-wrap:wrap;gap:1px;justify-content:flex-start}
.auto-wrap-list a{color:#000000;margin:0 10px;text-decoration:none;font-size:20px}
.auto-wrap-list a:hover{color:var(--primary)}
.main-content{flex:1;padding:100px 5% 10px;max-width:1200px;margin:0 auto;width:100%}
.page-title{text-align:center;margin:20px 0 20px;position:relative}
.page-title h1{font-size:30px;color:#555;margin-bottom:20px}
.page-title h2{font-size:28px;color:var(--text-light);margin-bottom:15px}
.page-title p{font-size:18px;color:var(--gray);max-width:800px;margin:0 auto}
.page-title a{text-align:center;color:var(--primary);text-decoration:none}
.slider-container{position:relative;width:100%;max-width:1200px;margin:0 auto 40px;border-radius:20px;overflow:hidden;box-shadow:0 15px 50px rgba(0,0,0,0.3);height:500px}
.slides{display:flex;height:100%;transition:transform .5s ease-in-out;will-change:transform}
.slide{min-width:100%;height:100%;position:relative}
.slide-img{width:100%;height:100%;object-fit:cover;display:block}
.slide-content{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,0.8),transparent);color:white;padding:30px}
.slide h2{font-size:2.2rem;margin-bottom:15px;text-shadow:0 2px 5px rgba(0,0,0,0.5)}
.slide p{font-size:1.1rem;margin-bottom:20px;max-width:600px;opacity:.9;line-height:1.6}
.slide a{display:inline-block;padding:12px 30px;background:linear-gradient(45deg,#ff416c,#ff4b2b);color:white;text-decoration:none;border-radius:30px;font-weight:bold;text-transform:uppercase;letter-spacing:1px;transition:all .3s ease;box-shadow:0 4px 15px rgba(255,65,108,0.4)}
.slide a:hover{transform:translateY(-3px);box-shadow:0 7px 20px rgba(255,65,108,0.6)}
.slider-nav{display:flex;justify-content:center;margin-top:20px}
.slider-dot{width:14px;height:14px;border-radius:50%;background-color:rgba(255,255,255,0.5);margin:0 8px;cursor:pointer;transition:all .3s ease}
.slider-dot.active{background-color:#ff416c;transform:scale(1.3)}
.slider-control{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,0.5);color:white;border:0;font-size:1.5rem;width:50px;height:50px;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;z-index:10}
.slider-control:hover{background:rgba(0,0,0,0.8);transform:translateY(-50%) scale(1.1)}
.prev{left:20px}
.next{right:20px}
.article-list{display:grid;grid-template-columns:1fr;gap:30px;margin-bottom:20px;padding:10px 0}
.article-item{display:flex;gap:10px;background:var(--card-light);border-radius:16px;overflow:hidden;box-shadow:var(--shadow);transition:var(--transition)}
.article-item a{display:contents}
.article-content{padding:20px;flex:1}
.article-meta{display:flex;align-items:center;margin-bottom:15px;font-size:14px;color:var(--gray)}
.article-meta i{margin-right:5px}
.article-tag{display:inline-block;background:rgba(247,37,133,0.1);color:var(--accent);padding:4px 15px;border-radius:20px;font-size:14px;font-weight:500;margin-right:15px}
.article-item h3{font-size:24px;margin-bottom:15px;color:var(--text-light)}
.article-item h3 a{text-decoration:none;color:#555;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}
.article-item p{color:#666;margin-bottom:10px;line-height:1.7;font-size:19px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden}
.article-img{width:35%;min-height:200px;object-fit:cover;display:block}
.article-detail{background:var(--card-light);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;padding:18px;margin-bottom:30px}
.article-header{margin-bottom:30px}
.article-title{font-size:32px;margin-bottom:20px;line-height:1.3}
.article-meta-large{display:flex;align-items:center;color:var(--gray);margin-bottom:30px;font-size:14px;flex-wrap:wrap}
.article-meta-large span{display:flex;align-items:center;margin-right:10px}
.article-meta-large a{color:#7d90a9;text-decoration:none}
.article-meta-large i{margin-right:3px;font-size:12px}
.featured-image{display:block;width:70%;height:300px;margin:0 auto;object-fit:cover;border-radius:12px;margin-bottom:20px;box-shadow:var(--shadow)}
.article-body{font-size:1.1rem}
.article-body p{margin-top:25px;margin-bottom:20px;line-height:1.8;font-weight:300;font-size:20px}
.article-body img{display:block;margin:0 auto;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:8px;box-shadow:0 4px 8px rgba(0,0,0,0.2)}
.article-body h2{margin:40px 0 25px;color:var(--text-light);position:relative;padding-bottom:10px}
.article-body h2:after{content:'';position:absolute;bottom:0;left:0;width:60px;height:3px;background:var(--primary)}
.article-body ol,.article-body ul{margin:25px 0;background-color:#f8f9fa;border-radius:8px;padding:15px 0;border-left:4px solid #3498db}
.article-body ol li,.article-body ul li{padding:12px 18px;margin:8px 0;background-color:white;border-radius:5px;box-shadow:0 2px 4px rgba(0,0,0,0.05);position:relative;list-style-type:none}
.article-body ol li:before,.article-body ul li:before{content:"";color:#3498db;font-weight:bold;display:inline-block;width:1em;margin-left:-1em;position:absolute;left:18px}
.article-body ol li:hover,.article-body ul li:hover{transform:translateX(5px);box-shadow:0 4px 8px rgba(52,152,219,0.2);background-color:#f0f7ff}
.article-body a{color:var(--text-light);font-size:15px;text-decoration:none;display:inline-block}
.article-body video{display:block;margin:0 auto;max-width:90%;width:auto;height:auto;object-fit:contain}
.tags-container{display:flex;flex-wrap:wrap;gap:15px;margin-bottom:10px;padding:10px 0}
.tag{display:inline-block;padding:5px 15px;margin:0px 5px 10px;background:rgba(67,97,238,0.1);color:var(--primary);border-radius:30px;font-size:16px;transition:var(--transition);text-decoration:none}
.tag:hover{background:var(--primary);color:white;transform:translateY(-1px)}
.epages{text-align:center;color:#808595;width:100%;clear:both;margin:20px auto}
.epages a{color:#808595;margin:0 5px 10px;padding:10px 15px;background:#ddd;border-radius:5px;text-decoration:none;display:inline-block}
.epages a:hover,.epages>b{color:#FFF;background:#404147}
.epages>b{padding:10px 15px}
.statement{padding-top:20px;line-height:22px;margin-top:20px;margin-bottom:20px;border-top:1px dotted #ccc;font-size:14px;color:#999}
.statement a{color:#92a0ad;text-decoration:none}
.search-container{margin:0 auto 20px}
.search-box{display:flex;margin-bottom:40px;box-shadow:var(--shadow);border-radius:50px;overflow:hidden}
.search-box form{width:100%;overflow:hidden}
.search-box input{flex:1;padding:18px 25px;border:0;font-size:16px;outline:0;background:#f7f7f7;color:var(--card-dark);width:80%}
.search-box button{float:right;padding:0 25px;margin:5px 10px;background:var(--primary);color:white;border:0;font-size:18px;font-weight:600;cursor:pointer;transition:var(--transition);border-radius:50px;height:46px}
.search-box button:hover{background:var(--secondary)}
.search-results .article-item{margin-bottom:30px}
.friends-links{background:var(--card-light);padding:20px;border-radius:16px;box-shadow:var(--shadow);margin-top:20px;margin-bottom:20px;text-align:left;max-width:1200px;width:100%}
.friends-links h2{color:var(--text-light);margin-bottom:40px;font-size:32px;position:relative;display:inline-block;padding-bottom:15px}
.friends-links h2:after{content:'';position:absolute;bottom:0;left:0;width:80px;height:4px;background:var(--primary);border-radius:2px}
.friend-links-container{display:flex;flex-wrap:wrap;gap:15px}
.friends-links a{padding:10px;color:var(--gray);font-size:15px;text-decoration:none}
.friend-link{border-radius:12px;padding:15px;transition:var(--transition);text-decoration:none;color:var(--text-light);font-weight:500}
.friend-link:hover{color:var(--primary)}
.comments-section{margin-top:50px;padding:30px;background:var(--card-light);border-radius:16px;box-shadow:var(--shadow);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif}
.comments-section h3{font-size:24px;margin-bottom:25px;padding-bottom:15px;border-bottom:1px solid #e6e6e6;color:var(--text-light);font-weight:500}
.comment-form{border-radius:8px;margin-bottom:25px}
.comment-form textarea{width:100%;padding:12px 15px;border:1px solid #e1e1e1;border-radius:4px;min-height:100px;font-size:16px;resize:vertical;background:#f9f9f9;color:#333;font-family:inherit}
.comment-form button{background-color:#6884af;color:white;border:0;padding:10px 25px;border-radius:4px;cursor:pointer;font-size:16px;margin-top:20px;font-weight:500;transition:background-color .2s;margin-left:auto;display:grid;justify-items:end}
.comment-form button:hover{background-color:#496591}
.comment-form .char-count{text-align:right;font-size:14px;color:#999;margin-top:-32px;margin-right:6px}
.comment-list{margin-top:0;padding-top:0;border-top:0}
.comments-header{padding:15px 25px;border-bottom:1px solid #eee;display:flex;justify-content:space-between;align-items:center;font-size:16px;color:#666;background:#fafafa}
.comments-count{margin-left:5px;font-size:15px;color:#576b95;font-weight:500}
.comments-list{padding:0 25px}
.comment-item{display:flex;padding:20px 0;border-top:1px solid #f0f0f0}
.comment-item:last-child{border-bottom:0}
.avatar{width:45px;height:45px;border-radius:50%;overflow:hidden;margin-right:15px;flex-shrink:0;background:#eee;display:flex;align-items:center;justify-content:center;color:#999;font-size:22px}
.avatar img{width:100%;height:100%;object-fit:cover}
.comment-content{flex:1}
.meta-line{display:flex;align-items:center;margin-bottom:8px;flex-wrap:wrap}
.comment-username{font-weight:500;color:#576b95;margin-right:10px;font-size:15px}
.comment-ip{color:#888;font-size:12px;padding:2px 6px;border-radius:3px;margin-right:10px}
.comment-time{color:#999;font-size:13px;margin-right:15px}
.actions{margin-left:auto;display:flex;align-items:center}
.actions a{text-decoration:none;color:#999}
.actions a:hover{color:#f00}
.action-btn{color:#999;background:0;border:0;font-size:13px;cursor:pointer;margin-left:15px;display:flex;align-items:center;transition:color .2s}
.action-btn:hover{color:#07c160}
.action-btn i{margin-right:4px;font-size:14px}
.like-btn.active{color:#f15a4a}
.comment-text{font-size:15px;color:#333;margin-bottom:10px;line-height:1.6}
.reply-content,.reply-container{background:#f8f8f8;border-radius:6px;padding:12px 15px;margin:8px 0;border-left:2px solid #ddd}
.reply-header{font-size:13px;color:#888;margin-bottom:5px;display:flex}
.reply-username{color:#576b95;font-weight:500;margin:0 5px}
.reply-text{font-size:14px;color:#555;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word;word-break:break-all}
.like-count{font-size:12px;color:#999;margin-left:4px}
.reply-form{padding:20px 25px;background:#f9f9f9;border-top:1px solid #eee}
.reply-form textarea{width:100%;height:80px;border:1px solid #ddd;border-radius:6px;padding:12px;font-size:14px;resize:none;margin-bottom:12px}
.reply-form textarea:focus{outline:0;border-color:#07c160;box-shadow:0 0 0 2px rgba(7,193,96,0.1)}
.submit-btn{background:#07c160;color:white;border:0;border-radius:4px;padding:8px 20px;font-size:14px;cursor:pointer;float:right;transition:background .2s}
.submit-btn:hover{background:#06ad54}
#char-count{font-size:16px;color:#666;transition:color 0.3s}
#char-count.warning{color:#ff4757;font-weight:600}
#char-count.exceeded{color:#ff3838;font-weight:700;animation:pulse 0.5s infinite alternate}
.top-comment-label{background:#fef4e6;color:#f60;font-size:12px;padding:2px 6px;border-radius:3px;margin-left:10px}
.author-label{background:#e6f7ff;color:#1890ff;font-size:12px;padding:2px 6px;border-radius:3px;margin-left:8px}
.quote{background-color:rgba(67,97,238,0.05);border-left:3px solid var(--primary);padding:10px 15px;margin:10px 0;border-radius:0 8px 8px 0;font-size:.9em;color:var(--gray)}
.quote-author{font-weight:600;color:var(--primary);margin-bottom:5px}
footer{background:var(--card-light);border-top:1px solid rgb(153 151 151 / 32%);color:var(--gray);text-align:center;padding:20px 5%;margin-top:10px;font-size:16px}
.copyright{padding-top:10px;padding-bottom:10px;color:var(--gray);font-size:14px}
.copyright a{color:var(--gray);font-size:14px;text-decoration:none}
.copyright a:hover{color:var(--primary)}
.go-top{position:fixed;bottom:30px;right:20px;width:45px;height:45px;border-radius:50%;background:var(--primary);color:white;border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem;box-shadow:0 4px 12px rgba(67,97,238,0.3);opacity:0;visibility:hidden;transition:var(--transition);z-index:999}
.go-top.visible{opacity:1;visibility:visible}
.go-top:hover{background:var(--secondary);transform:translateY(-3px)}
#overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.6);z-index:999;display:none;backdrop-filter:blur(3px);transition:opacity .3s ease}
#overlay.active{display:block;opacity:1}
.fa-search,.fa-bars,.article-body{animation:none!important;transition:none!important;opacity:1!important}
.modal-open .modal{overflow-x:hidden;overflow-y:auto}
.modal{position:fixed;top:0;left:0;z-index:1050;display:none;width:100%;height:100%;overflow:hidden;outline:0}
.modal-dialog{position:relative;top:30%;width:auto;margin:.5rem}
.modal.fade .modal-dialog{transition:-webkit-transform .3s ease-out;transition:transform .3s ease-out;transition:transform .3s ease-out,-webkit-transform .3s ease-out;-webkit-transform:translate(0,-50px);transform:translate(0,-50px)}
@media(prefers-reduced-motion:reduce){.modal.fade .modal-dialog{transition:none}
}.modal.show .modal-dialog{-webkit-transform:none;transform:none}
.modal.modal-static .modal-dialog{-webkit-transform:scale(1.02);transform:scale(1.02)}
.modal-dialog-scrollable{display:-ms-flexbox;display:flex;max-height:calc(100% - 1rem)}
.modal-dialog-scrollable .modal-content{max-height:calc(100vh - 1rem);overflow:hidden}
.modal-dialog-scrollable .modal-footer,.modal-dialog-scrollable .modal-header{-ms-flex-negative:0;flex-shrink:0}
.modal-dialog-scrollable .modal-body{overflow-y:auto}
.modal-dialog-centered{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;min-height:calc(100% - 1rem)}
.modal-dialog-centered::before{display:block;height:calc(100vh - 1rem);height:-webkit-min-content;height:-moz-min-content;height:min-content;content:""}
.modal-dialog-centered.modal-dialog-scrollable{-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;height:100%}
.modal-dialog-centered.modal-dialog-scrollable .modal-content{max-height:none}
.modal-dialog-centered.modal-dialog-scrollable::before{content:none}
.modal-content{position:relative;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;width:100%;pointer-events:auto;background-color:#fff;background-clip:padding-box;border:1px solid rgba(0,0,0,.2);border-radius:.3rem;outline:0;color:#333}
.modal-backdrop{position:fixed;top:0;left:0;z-index:1040;width:100vw;height:100vh;background-color:#000}
.modal-backdrop.fade{opacity:0}
.modal-backdrop.show{opacity:.5}
.modal-header{display:-ms-flexbox;display:flex;-ms-flex-align:start;align-items:flex-start;-ms-flex-pack:justify;justify-content:space-between;padding:1rem 1rem;border-bottom:1px solid #dddfeb;border-top-left-radius:calc(.3rem - 1px) border-top-right-radius:calc(.3rem - 1px)}
.modal-header .close{float:right;font-size:1.77rem;font-weight:700;line-height:1;color:#000;text-shadow:0 1px 0 #fff;opacity:.5;background-color:#fff;border:1px solid #fff;padding:1rem 1rem;margin:-1rem -1rem -1rem auto}
.modal-title{font-size:1.17rem;margin-bottom:0;line-height:1.5}
.modal-body{position:relative;-ms-flex:1 1 auto;flex:1 1 auto;padding:1rem}
.modal-footer{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;-ms-flex-align:center;align-items:center;-ms-flex-pack:end;justify-content:flex-end;padding:.75rem;border-top:1px solid #dddfeb;border-bottom-right-radius:calc(.3rem - 1px);border-bottom-left-radius:calc(.3rem - 1px)}
.modal-footer>*{margin:.25rem;padding:.375rem .75rem;color:#fff;background-color:#444;border:1px solid transparent;font-size:.98rem;line-height:1.5;border-radius:.25rem}
.modal-scrollbar-measure{position:absolute;top:-9999px;width:50px;height:50px;overflow:scroll}
.share-toolbar{position:fixed;right:20px;bottom:80px;display:flex;flex-direction:column;justify-content:inherit;z-index:99}
.share-btn{width:45px;height:45px;border-radius:50%;background:#fff;margin-bottom:12px;margin-right:0;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px rgba(0,0,0,0.15);cursor:pointer;transition:all .3s ease;position:relative}
.share-btn:hover{transform:translateY(-3px);box-shadow:0 4px 15px rgba(0,0,0,0.2)}
.share-btn i{font-size:20px;color:#333}
.share-btn.share{font-size:16px;background:0;color:#3498db;border:1px solid #3498db}
.share-btn.weibo{background:#e6162d}
.share-btn.weibo i{color:white}
.share-btn.qq{background:#12b7f5}
.share-btn.qq i{color:white}
.share-btn.wechat{background:#07c160}
.share-btn.wechat i{color:white}
.share-btn.bookmark{background:#f39c12}
.share-btn.bookmark i{color:white}
.share-btn.bookmark-list{background:#9b59b6}
.share-btn.bookmark-list i{color:white}
.popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:white;border-radius:12px;box-shadow:0 15px 50px rgba(0,0,0,0.2);width:90%;max-width:500px;z-index:1001;display:none}
@keyframes popupFadeIn{from{opacity:0;transform:translate(-50%,-45%)}
to{opacity:1;transform:translate(-50%,-50%)}
}.popup-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #eee}
.popup-title{font-size:1.2rem;font-weight:bold;color:#333}
.popup-close{background:0;border:0;font-size:1.5rem;cursor:pointer;color:#999;transition:color .3s}
.popup-close:hover{color:#333}
.popup-content{margin:20px}
.popup-content p{margin-bottom:15px;color:#555;overflow-wrap:break-word;word-break:break-all}
.qrcode-container{display:flex;flex-direction:column;align-items:center;padding:5px}
#qrcode{margin:15px 0}
.qrcode-text{font-size:14px;color:#666;margin-top:15px;text-align:center}
.bookmark-form{display:flex;flex-direction:column;gap:15px}
.bookmark-form input{padding:12px 15px;border:1px solid #ddd;border-radius:8px;font-size:1rem}
.bookmark-form input:focus{outline:0;border-color:#4361ee}
.bookmark-form button{padding:10px 15px;background:#3498db;color:white;border:0;border-radius:4px;cursor:pointer}
#save-bookmark{background:#4361ee;font-size:1rem;color:white;border:0;padding:12px;border-radius:8px;cursor:pointer;font-weight:500;transition:all .3s}
.bookmark-list{max-height:320px;border:0 solid #ccc;overflow-y:auto}
.bookmark-item{display:flex;justify-content:space-between;align-items:center;padding:10px 0;border-bottom:1px solid #efefef}
.bookmark-item:last-child{border-bottom:0}
.bookmark-item a{color:#3498db;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;margin-right:15px}
.bookmark-item a:hover{text-decoration:underline}
.bookmark-remove{display:flex;color:#e74c3c;cursor:pointer;font-size:15px;padding:5px;align-items:center;justify-content:center}
.bookmark-empty{text-align:center;padding:20px;color:#999}
.share-guide{font-size:14px;color:#666;margin-top:15px;text-align:center}
.share-options{display:flex;justify-content:center;gap:15px;margin-top:20px}
.share-option{display:flex;flex-direction:column;align-items:center;cursor:pointer}
.share-option i{font-size:32px;margin-bottom:5px}
.share-option span{font-size:12px;color:#666}
@media(min-width:576px){.modal-dialog{max-width:500px;margin:1.75rem auto}
.modal-dialog-scrollable{max-height:calc(100% - 3.5rem)}
.modal-dialog-scrollable .modal-content{max-height:calc(100vh - 3.5rem)}
.modal-dialog-centered{min-height:calc(100% - 3.5rem)}
.modal-dialog-centered::before{height:calc(100vh - 3.5rem);height:-webkit-min-content;height:-moz-min-content;height:min-content}
.modal-sm{max-width:300px}
}@media(max-width:992px){.slider-container{height:400px}
.slide-content{left:0;right:0}
.slide-content h2{font-size:28px}
.article-item{flex-direction:column}
.article-img{width:100%;height:240px}
}@media(max-width:768px){.navbar{padding:12px 5%}
.main-content{padding:80px 3% 10px}
.slider-container{height:350px}
.slide-content h2{font-size:24px}
.slide-content p{font-size:16px}
.page-title h1{font-size:28px}
.article-detail{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}
.comments-section{padding:20px}
.comment{padding:15px 0}
.share-toolbar{right:10px;bottom:60px}
.share-btn{width:40px;height:40px}
.popup{width:90%;max-width:70%;padding:15px}
}@media(max-width:576px){.logo{font-size:22px}
.auto-wrap-list{display:none}
.theme-toggle{width:40px;height:40px}
.theme-toggle span{display:none}
.nav-icon img{width:34px;height:34px;font-size:16px}
.slider-container{margin-top:10px;height:220px}
.slide-content h2{font-size:20px}
.slide a{position:absolute;right:20px;bottom:20px;padding:6px 15px}
.article-img{height:200px;padding:0 10px 10px 10px;border-radius:0 0 20px 20px}
.article-item{gap:2px}
.article-item h3{font-size:20px}
.article-content{padding:15px 10px 0 10px}
.article-detail{padding:18px 10px}
.article-list{margin-bottom:10px}
.article-title{font-size:26px;color:#555;transition:none}
.article-body p{font-weight:400}
.featured-image{width:100%;height:auto}
.search-box input{width:60%}
.article-item h3{margin-bottom:10px;font-weight:400;font-size:20px}
.slide-content p,.article-item p,.slider-control,.links,.friends-links,.copyright,.go-top{display:none}
.comments-section{padding:20px 15px}
.comments-section h3{font-size:24px}
.reply-content{margin-left:1px;padding-left:10px}
.avatar{width:35px;height:35px}
footer{padding:0;margin-top:30px}
}@media(max-width:480px){.dropdown{width:370px}
.menu-dropdown{top:0;right:0;bottom:0;width:100vw;border-radius:0}
.actions{margin-left:0;width:100%;margin-top:8px}
.share-toolbar{display:flex;position:initial;justify-content:center;flex-direction:row;z-index:99;margin-right:0;bottom:6px}
.share-btn{width:40px;height:40px;margin:0 6px}
.popup{width:90%;max-width:90%;padding:5px}
}
body.dark-theme{background-color:#121212;color:#e0e0e0}
body.dark-theme .auto-wrap-list a{color:#fff}
body.dark-theme .nav-icon .fas{color:#e0e0e0}
body.dark-theme .theme-toggle{background:rgba(67,97,238,0.1);box-shadow:0 4px 6px rgba(0,0,0,0.3)}
body.dark-theme .theme-toggle i{color:#bb86fc}
body.dark-theme .theme-toggle span{color:#e0e0e0}
body.dark-theme .dropdown{background:var(--card-dark);box-shadow:0 5px 15px rgba(0,0,0,0.3)}
body.dark-theme .dropdown h3{border-bottom:1px solid rgba(255,255,255,0.1)}
body.dark-theme .dropdown a{color:var(--text-dark)}
body.dark-theme .navbar{background:rgba(30,30,30,0.95);box-shadow:0 4px 20px rgba(0,0,0,0.3)}
body.dark-theme .article-meta-large{color:rgba(255,255,255,.3)}
body.dark-theme{.article-item,.article-detail,.friends-links,.comments-section{background:var(--card-dark)}
.article-item h3 a,.article-title,.article-body,.article-body h2,.page-title h2,.comments-section h3,.article-body a{color:var(--text-dark)}
.article-body{color:#e9e9e9c7;ol,ul{background-color:var(--gray);li{background-color:#434141;&:hover{background-color:#2e2f31}
}}}
.article-body video{max-width:100%}
.comments-section h3{border-bottom:1px solid #777}
.search-box{background:var(--card-dark);input{background:var(--card-dark);color:var(--bg-1)}
}.epages a{background:#333}
.comment-form{border-color:#444;border-radius:8px;margin-bottom:25px}
.reply-content,.reply-form,.reply-container,.comment-form textarea,.reply-form textarea,.comment-form-sign{background:#2a2a2a;border-color:#444;color:#777}
.comment-form textarea,.reply-form textarea,.comment-form-sign{color:#e0e0e0;background:#333}
.comment-item{border-top:1px solid #2d2d2d}
.comment-text,.comment-content,.reply .comment-text{color:#e0e0e0}
.comment-username{color:#7d90a9}
.comment-time,.comment-ip{color:#616060}
.comment{border-top:1px solid #333}
footer{background:var(--card-dark);border-top:1px solid rgba(255,255,255,0.05)}
}body.dark-theme .popup{background:#111;box-shadow:1px 0 10px 5px rgb(109 108 108 / 59%)}
body.dark-theme .popup-title{color:#ccc}
body.dark-theme .popup-header{border-bottom:1px solid #333}
body.dark-theme .bookmark-item{border-bottom:1px solid #333}
body.dark-theme .bookmark-form input{border:1px solid #333;background:#111;color:white}
body.dark-theme #save-bookmark{background:#222}