:root {
            --color-soft: #fecea8;
            --color-coral: #ff847c;
            --color-red: #e84a5f;
            --color-dark: #2a363b;
            --color-white: #ffffff;
            --color-light-bg: #fdf6f0;
            --color-card-bg: #fffdfb;
            --color-border: #f0e0d0;
            --color-text: #2a363b;
            --color-text-light: #5a5a5a;
            --color-shadow: rgba(42,54,59,0.08);
            --color-shadow-hover: rgba(232,74,95,0.15);
            --transition: 0.25s ease;
        }
        * { margin:0; padding:0; box-sizing:border-box; }
        html { scroll-behavior:smooth; scroll-padding-top:70px; }
        body {
            font-family:"PingFang SC","Microsoft YaHei","Helvetica Neue",Arial,sans-serif;
            background-color:#faf7f3; color:var(--color-text); line-height:1.6; min-height:100vh;
            display:flex; flex-direction:column;
        }
        .top-nav { width:100%; background-color:var(--color-dark); color:var(--color-white); position:sticky; top:0; z-index:1000; box-shadow:0 2px 12px rgba(0,0,0,0.2); }
        .top-nav-inner { max-width:1400px; margin:0 auto; display:flex; align-items:center; justify-content:space-between; padding:0 24px; height:60px; flex-wrap:wrap; }
        .top-nav-left { display:flex; align-items:center; gap:10px; flex-shrink:0; }
        .top-nav-left .logo-icon { width:38px; height:38px; border-radius:8px; object-fit:cover; background-color:var(--color-coral); flex-shrink:0; }
        .top-nav-left h1 { font-size:1.35rem; font-weight:700; color:var(--color-white); letter-spacing:1.5px; white-space:nowrap; margin:0; line-height:1; }
        .top-nav-center { display:flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:center; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; flex:1; padding:0 12px; min-width:0; }
        .top-nav-center::-webkit-scrollbar { display:none; }
        .top-nav-center a { color:#d0d4d6; text-decoration:none; font-size:0.9rem; padding:7px 13px; border-radius:20px; transition:var(--transition); white-space:nowrap; font-weight:500; letter-spacing:0.4px; flex-shrink:0; }
        .top-nav-center a:hover, .top-nav-center a.active { background-color:var(--color-red); color:#fff; font-weight:600; }
        .top-nav-right { display:flex; align-items:center; gap:10px; flex-shrink:0; }
        .user-avatar { width:34px; height:34px; border-radius:50%; object-fit:cover; border:2px solid var(--color-coral); background-color:#555; flex-shrink:0; }
        .user-status { color:#e0e0e0; font-size:0.85rem; cursor:pointer; white-space:nowrap; transition:var(--transition); font-weight:500; }
        .user-status:hover { color:var(--color-coral); }
        .login-btn { background-color:var(--color-red); color:#fff; border:none; padding:8px 18px; border-radius:20px; cursor:pointer; font-size:0.85rem; font-weight:600; letter-spacing:0.5px; transition:var(--transition); white-space:nowrap; flex-shrink:0; }
        .login-btn:hover { background-color:#d13a4e; box-shadow:0 4px 14px rgba(232,74,95,0.4); }
        .main-container { max-width:1400px; margin:0 auto; display:flex; gap:24px; padding:20px 24px; flex:1; }
        .content-left { flex:1; min-width:0; display:flex; flex-direction:column; gap:32px; }
        .sidebar-right { width:320px; flex-shrink:0; display:flex; flex-direction:column; gap:24px; position:sticky; top:84px; align-self:flex-start; max-height:calc(100vh - 100px); overflow-y:auto; scrollbar-width:thin; scrollbar-color:#ddd transparent; }
        .sidebar-right::-webkit-scrollbar { width:4px; }
        .sidebar-right::-webkit-scrollbar-thumb { background:#ccc; border-radius:4px; }
        .section-title { font-size:1.4rem; font-weight:700; color:var(--color-dark); padding-left:16px; border-left:4px solid var(--color-red); margin-bottom:16px; letter-spacing:1px; display:flex; align-items:center; gap:10px; }
        .section-title .sub-tag { font-size:0.75rem; background:var(--color-coral); color:#fff; padding:3px 10px; border-radius:12px; font-weight:500; letter-spacing:0.5px; }
        .hot-movies-grid { display:grid; grid-template-columns:repeat(6, 1fr); gap:14px; }
        .movie-card { background:var(--color-card-bg); border-radius:10px; overflow:hidden; box-shadow:0 2px 8px var(--color-shadow); transition:var(--transition); cursor:pointer; display:flex; flex-direction:column; border:1px solid var(--color-border); }
        .movie-card:hover { transform:translateY(-4px); box-shadow:0 8px 24px var(--color-shadow-hover); border-color:var(--color-coral); }
        .movie-card img { width:100%; height:210px; object-fit:cover; display:block; background-color:#f0e8e0; flex-shrink:0; }
        .movie-card-info { padding:10px 12px; flex:1; display:flex; flex-direction:column; gap:4px; }
        .movie-card-info .movie-title { font-weight:700; font-size:0.95rem; color:var(--color-dark); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .movie-card-info .movie-meta { font-size:0.7rem; color:#777; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
        .movie-card-info .movie-type-tag { display:inline-block; background:var(--color-soft); color:var(--color-dark); font-size:0.68rem; padding:2px 8px; border-radius:10px; font-weight:500; align-self:flex-start; }
        .weekly-ranking { display:flex; gap:14px; overflow-x:auto; padding:8px 0 16px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:thin; scrollbar-color:#ddd transparent; }
        .weekly-ranking::-webkit-scrollbar { height:4px; }
        .weekly-ranking::-webkit-scrollbar-thumb { background:#ccc; border-radius:4px; }
        .weekly-rank-item { flex:0 0 180px; scroll-snap-align:start; background:var(--color-card-bg); border-radius:10px; overflow:hidden; box-shadow:0 2px 8px var(--color-shadow); transition:var(--transition); cursor:pointer; position:relative; border:1px solid var(--color-border); flex-shrink:0; }
        .weekly-rank-item:hover { transform:translateY(-3px); box-shadow:0 6px 20px var(--color-shadow-hover); }
        .weekly-rank-item .rank-badge { position:absolute; top:8px; left:8px; background:var(--color-red); color:#fff; width:28px; height:28px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:0.8rem; z-index:2; }
        .weekly-rank-item img { width:100%; height:240px; object-fit:cover; display:block; background-color:#f0e8e0; }
        .weekly-rank-item .rank-info { padding:10px; text-align:center; }
        .weekly-rank-item .rank-info .r-title { font-weight:700; font-size:0.9rem; color:var(--color-dark); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
        .weekly-rank-item .rank-info .r-meta { font-size:0.7rem; color:#888; margin-top:2px; }
        .stars-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:16px; }
        .star-card { background:var(--color-card-bg); border-radius:12px; overflow:hidden; box-shadow:0 2px 10px var(--color-shadow); transition:var(--transition); cursor:pointer; text-align:center; border:1px solid var(--color-border); }
        .star-card:hover { transform:translateY(-4px); box-shadow:0 8px 24px var(--color-shadow-hover); border-color:var(--color-coral); }
        .star-card img { width:100%; height:220px; object-fit:cover; display:block; background-color:#f0e8e0; }
        .star-card .star-name { font-weight:700; font-size:1rem; padding:8px 10px 2px; color:var(--color-dark); }
        .star-card .star-desc { font-size:0.75rem; color:#777; padding:0 10px 12px; line-height:1.4; }
        .plot-grid, .detail-grid { display:grid; grid-template-columns:repeat(2, 1fr); gap:16px; }
        .plot-card, .detail-card { background:var(--color-card-bg); border-radius:10px; padding:16px 18px; box-shadow:0 2px 8px var(--color-shadow); transition:var(--transition); border:1px solid var(--color-border); cursor:pointer; }
        .plot-card:hover, .detail-card:hover { box-shadow:0 6px 18px var(--color-shadow-hover); border-color:var(--color-coral); }
        .plot-card h4, .detail-card h4 { font-size:1rem; color:var(--color-dark); margin-bottom:6px; font-weight:700; }
        .plot-card p, .detail-card p { font-size:0.82rem; color:#666; line-height:1.5; }
        .detail-card .detail-meta { font-size:0.72rem; color:#999; margin-top:4px; display:flex; flex-wrap:wrap; gap:8px; }
        .detail-card .detail-meta span { background:var(--color-soft); padding:2px 8px; border-radius:10px; color:var(--color-dark); font-weight:500; }
        .comments-list { display:flex; flex-direction:column; gap:14px; }
        .comment-item { background:var(--color-card-bg); border-radius:10px; padding:14px 18px; box-shadow:0 1px 6px var(--color-shadow); border-left:3px solid var(--color-coral); transition:var(--transition); border:1px solid var(--color-border); }
        .comment-item:hover { box-shadow:0 4px 14px var(--color-shadow-hover); }
        .comment-item .comment-user { font-weight:700; font-size:0.9rem; color:var(--color-dark); margin-bottom:4px; }
        .comment-item .comment-text { font-size:0.84rem; color:#555; line-height:1.6; }
        .comment-item .comment-time { font-size:0.7rem; color:#aaa; margin-top:4px; }
        .platform-intro { background:linear-gradient(135deg,#fef9f4 0%,#fdf2e8 100%); border-radius:12px; padding:24px 28px; border:1px solid var(--color-border); line-height:1.8; color:#4a4a4a; }
        .platform-intro h3 { color:var(--color-dark); margin-bottom:10px; font-size:1.15rem; }
        .platform-intro p { font-size:0.9rem; }
        .app-download-grid { display:grid; grid-template-columns:repeat(4, 1fr); gap:14px; }
        .app-download-card { background:var(--color-card-bg); border-radius:12px; padding:20px 16px; text-align:center; box-shadow:0 2px 10px var(--color-shadow); transition:var(--transition); cursor:pointer; border:2px solid transparent; text-decoration:none; color:inherit; display:flex; flex-direction:column; align-items:center; gap:10px; }
        .app-download-card:hover { border-color:var(--color-red); box-shadow:0 8px 24px var(--color-shadow-hover); transform:translateY(-3px); }
        .app-download-card .app-icon { width:56px; height:56px; border-radius:14px; object-fit:cover; background-color:#e8e0d8; }
        .app-download-card .app-name { font-weight:700; font-size:0.95rem; color:var(--color-dark); }
        .app-download-card .app-version { font-size:0.7rem; color:#999; }
        .app-download-card .app-btn { background:var(--color-red); color:#fff; padding:8px 20px; border-radius:20px; font-weight:600; font-size:0.8rem; letter-spacing:0.5px; transition:var(--transition); border:none; cursor:pointer; text-decoration:none; display:inline-block; }
        .app-download-card .app-btn:hover { background:#c9394e; }
        .sidebar-card { background:var(--color-card-bg); border-radius:12px; padding:18px 20px; box-shadow:0 2px 10px var(--color-shadow); border:1px solid var(--color-border); }
        .sidebar-card h3 { font-size:1.05rem; font-weight:700; color:var(--color-dark); margin-bottom:12px; padding-bottom:10px; border-bottom:2px solid var(--color-soft); }
        .total-read-num { font-size:2.6rem; font-weight:800; color:var(--color-red); letter-spacing:1px; text-align:center; margin:8px 0; }
        .total-read-label { text-align:center; font-size:0.8rem; color:#888; }
        .update-time { text-align:center; font-size:0.72rem; color:#aaa; margin-top:6px; }
        .stat-row { display:flex; justify-content:space-between; padding:10px 0; border-bottom:1px dashed #f0e8dc; }
        .stat-row:last-child { border-bottom:none; }
        .stat-label { font-size:0.85rem; color:#666; }
        .stat-value { font-weight:700; color:var(--color-dark); font-size:1rem; }
        .stat-value.highlight { color:var(--color-red); font-size:1.1rem; }
        .sidebar-mini-list { display:flex; flex-direction:column; gap:8px; }
        .sidebar-mini-item { display:flex; align-items:center; gap:10px; padding:6px 0; cursor:pointer; transition:var(--transition); border-radius:6px; }
        .sidebar-mini-item:hover { background:#fdf6f0; }
        .sidebar-mini-item img { width:50px; height:68px; object-fit:cover; border-radius:4px; background-color:#f0e8e0; flex-shrink:0; }
        .sidebar-mini-item .mini-info { font-size:0.8rem; color:var(--color-dark); font-weight:600; line-height:1.3; min-width:0; }
        .sidebar-mini-item .mini-info .mini-sub { font-size:0.68rem; color:#999; font-weight:400; }
        .bottom-nav { width:100%; background-color:var(--color-dark); color:#ccc; padding:28px 24px 18px; margin-top:auto; }
        .bottom-nav-inner { max-width:1400px; margin:0 auto; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:16px; }
        .bottom-nav-links { display:flex; flex-wrap:wrap; gap:16px; font-size:0.82rem; }
        .bottom-nav-links a { color:#b0b5b7; text-decoration:none; transition:var(--transition); white-space:nowrap; }
        .bottom-nav-links a:hover { color:var(--color-coral); }
        .bottom-nav-mobile-link { background:var(--color-red); color:#fff; padding:10px 20px; border-radius:22px; font-weight:600; text-decoration:none; font-size:0.85rem; letter-spacing:0.5px; transition:var(--transition); white-space:nowrap; }
        .bottom-nav-mobile-link:hover { background:#d13a4e; box-shadow:0 4px 14px rgba(232,74,95,0.4); }
        .bottom-copyright { width:100%; text-align:center; font-size:0.72rem; color:#777; margin-top:14px; padding-top:12px; border-top:1px solid rgba(255,255,255,0.08); }
        .friend-links-area { background:var(--color-card-bg); border-radius:12px; padding:18px 20px; box-shadow:0 2px 10px var(--color-shadow); border:1px solid var(--color-border); margin-top:20px; display:flex; flex-wrap:wrap; gap:10px 20px; align-items:center; }
        .friend-links-area span { font-size:0.9rem; color:var(--color-dark); font-weight:600; margin-right:10px; }
        .friend-links-area a { font-size:0.82rem; color:var(--color-red); text-decoration:none; transition:var(--transition); }
        .friend-links-area a:hover { text-decoration:underline; }
        @media (max-width:1200px) { .hot-movies-grid { grid-template-columns:repeat(4, 1fr); } .stars-grid { grid-template-columns:repeat(3, 1fr); } .app-download-grid { grid-template-columns:repeat(2, 1fr); } .sidebar-right { width:280px; } }
        @media (max-width:900px) {
            .main-container { flex-direction:column; padding:12px; }
            .sidebar-right { width:100%; position:static; max-height:none; flex-direction:row; flex-wrap:wrap; gap:12px; order:10; }
            .sidebar-right .sidebar-card { flex:1 1 45%; min-width:200px; }
            .hot-movies-grid { grid-template-columns:repeat(3, 1fr); gap:10px; }
            .stars-grid { grid-template-columns:repeat(2, 1fr); }
            .plot-grid, .detail-grid { grid-template-columns:1fr; }
            .app-download-grid { grid-template-columns:repeat(2, 1fr); }
            .top-nav-center { order:3; flex-basis:100%; justify-content:flex-start; padding:4px 0; gap:4px; }
            .top-nav-center a { font-size:0.78rem; padding:5px 10px; }
            .top-nav-inner { height:auto; padding:8px 14px; gap:6px; }
            .movie-card img { height:160px; }
            .weekly-rank-item { flex:0 0 140px; }
            .weekly-rank-item img { height:190px; }
        }
        @media (max-width:600px) {
            .hot-movies-grid { grid-template-columns:repeat(2, 1fr); gap:8px; }
            .stars-grid { grid-template-columns:repeat(2, 1fr); gap:10px; }
            .app-download-grid { grid-template-columns:1fr 1fr; gap:10px; }
            .movie-card img { height:150px; }
            .star-card img { height:170px; }
            .weekly-rank-item { flex:0 0 130px; }
            .weekly-rank-item img { height:170px; }
            .sidebar-right .sidebar-card { flex:1 1 100%; min-width:0; }
            .section-title { font-size:1.15rem; }
            .top-nav-left h1 { font-size:1.1rem; }
            .bottom-nav-inner { flex-direction:column; text-align:center; }
            .bottom-nav-links { justify-content:center; }
        }