/* 现代化颜色方案 */
:root {
    /* 主要品牌色 - 紫色系 */
    --primary-color: #6c63ff;
    --primary-light: #8b83ff;
    --primary-dark: #5a52e6;
    --secondary-color: #ff6b9d;
    --accent-color: #00d4ff;
    
    /* 背景色 */
    --bg-primary: #f7f8fc;
    --bg-secondary: #f0f2ff;
    --bg-card: #fafbff;
    --bg-hover: #eef1ff;
    --bg-gradient-1: linear-gradient(135deg, #6c63ff, #8b83ff);
    --bg-gradient-2: linear-gradient(135deg, #ff6b9d, #ffa8c5);
    --bg-gradient-3: linear-gradient(135deg, #00d4ff, #5ae4ff);
    
    /* 文字颜色 */
    --text-primary: #2d3748;
    --text-secondary: #718096;
    --text-light: #a0aec0;
    --text-white: #ffffff;
    
    /* 边框和阴影 */
    --border-color: var(--border-color);
    --shadow-sm: 0 2px 8px rgba(108, 99, 255, 0.06);
    --shadow-md: 0 4px 16px rgba(108, 99, 255, 0.12);
    --shadow-lg: 0 8px 30px rgba(108, 99, 255, 0.18);
    
    /* 动画 */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-slow: 0.5s ease;
}

/* 基础样式更新 */
html{font-size:100px;}
html,body{height:100%;}
html,body,div,h1,h2,h3,h4,h5,h6,p,span,em,a,img,ul,li,ol,form,button,input,textarea,dl,dt,dd,iframe{margin:0;padding:0;}
body{
    background: var(--bg-primary);
    text-align:left;
    font:14px/1.6 'Segoe UI', 'Microsoft Yahei', -apple-system, BlinkMacSystemFont, sans-serif;
    color: var(--text-primary);
    transition: all var(--transition-normal);
}
a{
    cursor:pointer;
    color: var(--text-primary);
    text-decoration:none;
    outline:0 none;
    transition: all var(--transition-fast);
}
a:hover,a:focus{
    text-decoration:none;
    color: var(--primary-color);
    outline:none;
}
h1,h2,h3,h4,h5,h6,em{font-size:16px;font-weight:600;}
ol,ul{list-style:none;}
em{font-style:normal;}
img{border:0;vertical-align:middle;border-radius: 8px;}
img,a{-webkit-touch-callout:none;}
.clearfix:after{content:'';display:block;clear:both;visibility:hidden;height:0;}
.clearfix{zoom:1;}
.wrap{margin:0 auto;width:1300px;overflow:hidden;}
.pc{display:inline;}
.mt{display:none;}

/* 字体保持原样 */
@font-face{
	font-family:'Voltaire';
	font-style:normal;
	font-weight:400;
	src:url('../font/voltaire.eot'); 
	src:local('Voltaire'),url('../font/voltaire.woff2') format('woff2'); 
	src:local('Voltaire'),url('../font/voltaire.woff') format('woff'); 
	unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
	font-display: swap;
}
@font-face{
	font-family:"iconfont";
	src:url('../font/iconfont.eot'); 
	src:url('../font/iconfont.eot#iefix') format('embedded-opentype'), 
	url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'),
	url('../font/iconfont.woff') format('woff'),
	url('../font/iconfont.ttf') format('truetype'), 
	url('../font/iconfont.svg') format('svg'); 
	font-display: swap;
}
[class*='icon-'],[class^='icon-']{font-family:'iconfont' !important;font-style:normal;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
.icon-top:before{content:"\e63c";}
.icon-home:before{content:"\e611";}
.icon-close:before{content:"\e624";}
.icon-apple:before{content:"\e646";}
.icon-android:before{content:"\e68c";}
.icon-desktop:before{content:"\e772";}
.icon-url:before{content:"\e656";}
.icon-email:before{content:"\e826";}
.icon-bs-menu:before{content:"\e608";color: var(--accent-color);}
.icon-bs-more:before{content:"\e606";color: var(--accent-color);}
.icon-safari:before{content:"\e668";color: var(--accent-color);}

/* 导航栏现代化 */
.nav-wrap{
    background: var(--bg-gradient-1);
    position: relative;
    box-shadow: var(--shadow-md);
}
.nav-wrap::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
    pointer-events: none;
}
.nav{box-sizing:border-box;width:1300px;margin:0 auto;position: relative;z-index: 2;}
.nav li{padding:0 10px;box-sizing:border-box;}
.nav .logo{float:left;min-width:22%;padding: 12px 0;overflow:hidden;}
.nav .logo .domain{text-align:center;font-size:28px;text-transform:uppercase;font-weight: 700;}
.nav .logo .domain a{color: var(--text-white);text-shadow: 0 2px 4px rgba(0,0,0,0.2);}
.nav .logo .domain a:hover{color:rgba(255,255,255,0.9);transform: scale(1.05);transition: all var(--transition-fast);}
.nav .logo .url{line-height:32px;text-align:center;}
.nav .logo .url span{
    display:block;
    margin:1px;
    border-radius:25px;
    border:1px solid rgba(255,255,255,.15);
    padding:0 15px;
    height:36px;
    line-height:36px;
    background: rgba(255,255,255,0.95);
    color: var(--text-secondary);
    text-transform:lowercase;
    backdrop-filter: blur(10px);
    font-weight: 500;
}
.nav .logo .url i{font-style:normal;color: var(--primary-color);font-weight: 600;}
.nav .btn-icon{float:right;width:75%;padding:12px 0;}
.nav .btn-icon li{
    width:20%;
    text-align:center;
    float:left;
    position:relative;
    display:inline-block;
    border-radius: 12px;
    transition: all var(--transition-normal);
}
.nav .btn-icon li i{
    display:block;
    height:48px;
    line-height:48px;
    font-size:48px;
    margin:0 auto;
    padding:0px 0 0px 0;
    transition: all var(--transition-normal);
}
.nav .btn-icon li span{display:block;height:20px;line-height:20px;font-weight: 500;}
.nav .btn-icon li span.subtitle{color: rgba(255,255,255,0.8);}
.nav .btn-icon li a{display:block;width:100%;height:100%;color: var(--text-white);}
.nav .btn-icon li:hover{
    background: rgba(255,255,255,0.15);
    transform: translateY(-2px);
    box-shadow: 0 4px 20px rgba(0,0,0,0.1);
}
.nav .btn-icon li:hover i{transform: scale(1.1);}
.nav .btn-icon li:hover .tips{display:block;}
.nav .btn-icon li .tips{
    display:none;
    position:absolute;
    left:50%;
    margin-left:-120px;
    margin-top:25px;
    box-sizing:border-box;
    box-shadow: var(--shadow-lg);
    border-radius:12px;
    padding:16px;
    min-width:240px;
    line-height:26px;
    background: var(--bg-card);
    color: var(--text-primary);
    white-space:nowrap;
    backdrop-filter: blur(20px);
    border: 1px solid rgba(255,255,255,0.2);
}
.nav .btn-icon li .tips:before,.tips:after{content:"";position:absolute;display:block;border-width:8px;border-style:solid;width:0;height:0;}
.nav .btn-icon li .tips:before{left:50%;margin-left:-8px;top:-16px;border-color:transparent transparent var(--bg-card) transparent;}
.nav .btn-icon li .tips p{color: var(--primary-color);font-weight: 600;}
.nav .btn-icon li .tips em{padding:0;font-style:normal;font-weight:normal;font-size:14px;}
.nav .btn-icon li .tips span{display:none;}

/* 导航菜单现代化样式 */
.menu {
    margin-top: 25px;
    border-radius: 16px;
    box-sizing: border-box;
    background: var(--bg-card);
    padding: 0 25px;
    box-shadow: 0 4px 16px rgba(108, 99, 255, 0.12);
    border: 1px solid rgba(108, 99, 255, 0.1);
    backdrop-filter: blur(10px);
}

.menu dl {
    float: left;
    width: 100%;
    padding: 18px 0;
    border-top: 1px solid #e2e8f0;
    margin-bottom: 0;
}

.menu dl:first-child {
    border-top: 0;
}

/* 分类标题样式 */
.menu dt {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    line-height: 50px !important;
    text-align: left !important;
    width: 100% !important;
    font-size: 20px;
    font-weight: 600;
    position: relative;
    padding: 8px 0;
    border-radius: 8px;
    transition: all 0.3s ease;
}

.menu dt:hover {
    background: #f5f7ff;
    padding-left: 12px;
    padding-right: 12px;
}

.menu dt a {
    color: #6c63ff;
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    flex-grow: 1;
    transition: all 0.3s ease;
}

.menu dt a:hover {
    color: #ff6b9d;
    transform: translateX(4px);
}

/* 展开/收合按钮优化 */
.toggle-btn {
    width: 40px !important;
    height: 40px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: none !important;
    border: none !important;
    border-radius: 50% !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    margin-left: 12px !important;
}

.toggle-btn:hover {
    background: rgba(108, 99, 255, 0.1) !important;
    transform: scale(1.1) !important;
}

.toggle-btn:focus {
    outline: none;
    box-shadow: 0 0 0 3px rgba(108, 99, 255, 0.3);
}

/* 箭头样式 */
.arrow {
    width: 12px !important;
    height: 12px !important;
    border-right: 2px solid #718096 !important;
    border-bottom: 2px solid #718096 !important;
    transform: rotate(45deg) !important;
    transition: all 0.3s ease !important;
}

.arrow-down {
    transform: rotate(225deg) !important;
    border-color: #6c63ff !important;
}

.toggle-btn:hover .arrow {
    border-color: #6c63ff !important;
}

/* 子分类容器样式 */
.subcategories {
    display: none !important;
    flex-wrap: wrap !important;
    gap: 10px !important;
    padding: 0 !important;
    opacity: 0 !important;
    max-height: 0 !important;
    overflow: hidden !important;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
    margin-top: 0 !important;
}

.subcategories.show {
    display: flex !important;
    opacity: 1 !important;
    max-height: 500px !important;
    padding: 20px 0 15px 0 !important;
    margin-top: 10px !important;
}

/* 子分类链接样式 */
.subcategory-link {
    padding: 8px 16px !important;
    background: linear-gradient(135deg, #f8faff, #f0f2ff) !important;
    border-radius: 20px !important;
    font-size: 14px !important;
    color: #718096 !important;
    text-decoration: none !important;
    margin: 0 !important;
    display: inline-block !important;
    transition: all 0.3s ease !important;
    border: 1px solid rgba(108, 99, 255, 0.1) !important;
    font-weight: 500 !important;
    position: relative;
    overflow: hidden;
}

.subcategory-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(108, 99, 255, 0.1), transparent);
    transition: left 0.5s ease;
}

.subcategory-link:hover {
    background: linear-gradient(135deg, #6c63ff, #8b83ff) !important;
    color: white !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(108, 99, 255, 0.3) !important;
    border-color: #8b83ff !important;
}

.subcategory-link:hover::before {
    left: 100%;
}

.subcategory-link:active {
    transform: translateY(0) !important;
}

/* 分类标题左侧装饰线 */
.menu dt::before {
    content: '';
    position: absolute;
    left: -25px;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 0;
    background: linear-gradient(135deg, #6c63ff, #ff6b9d);
    border-radius: 2px;
    transition: height 0.3s ease;
}

.menu dt:hover::before {
    height: 30px;
}

/* 响应式优化 */
@media screen and (max-width: 768px) {
    .menu {
        margin-top: 20px;
        padding: 0 15px;
        border-radius: 12px;
    }
    
    .menu dt {
        font-size: 16px;
        line-height: 44px !important;
        padding: 6px 0;
    }
    
    .menu dt a {
        font-size: 16px;
    }
    
    .toggle-btn {
        width: 36px !important;
        height: 36px !important;
        margin-left: 8px !important;
    }
    
    .arrow {
        width: 10px !important;
        height: 10px !important;
    }
    
    .subcategories.show {
        padding: 15px 0 12px 0 !important;
    }
    
    .subcategory-link {
        padding: 6px 12px !important;
        font-size: 13px !important;
        border-radius: 16px !important;
    }
}

/* 超小屏幕 */
@media screen and (max-width: 480px) {
    .menu {
        padding: 0 10px;
        border-radius: 8px;
    }
    
    .menu dt {
        line-height: 40px !important;
        padding: 4px 0;
    }
    
    .menu dt a {
        font-size: 15px;
    }
    
    .toggle-btn {
        width: 32px !important;
        height: 32px !important;
    }
    
    .subcategory-link {
        padding: 5px 10px !important;
        font-size: 12px !important;
    }
}

/* 夜色模式适配 */
@media (prefers-color-scheme: dark) {
    .menu {
        background: #1a202c;
        border-color: rgba(139, 131, 255, 0.2);
    }
    
    .menu dt {
        border-color: #4a5568;
    }
    
    .menu dt:hover {
        background: #2d3748;
    }
    
    .menu dt a {
        color: #8b83ff;
    }
    
    .menu dt a:hover {
        color: #ff8cc8;
    }
    
    .subcategory-link {
        background: linear-gradient(135deg, #2d3748, #374151) !important;
        color: #cbd5e0 !important;
        border-color: rgba(139, 131, 255, 0.2) !important;
    }
    
    .subcategory-link:hover {
        background: linear-gradient(135deg, #8b83ff, #a39bff) !important;
        color: white !important;
        box-shadow: 0 6px 20px rgba(139, 131, 255, 0.4) !important;
    }
}

/* 加载动画 */
@keyframes slideDown {
    from {
        opacity: 0;
        max-height: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        max-height: 500px;
        transform: translateY(0);
    }
}

.subcategories.show {
    animation: slideDown 0.4s ease-out;
}

/* 无障碍访问 */
@media (prefers-reduced-motion: reduce) {
    .menu dt,
    .toggle-btn,
    .arrow,
    .subcategories,
    .subcategory-link {
        transition: none !important;
        animation: none !important;
    }
    
    .menu dt:hover,
    .subcategory-link:hover {
        transform: none !important;
    }
}

/* 打印样式 */
@media print {
    .menu {
        box-shadow: none;
        border: 1px solid #ccc;
    }
    
    .toggle-btn {
        display: none !important;
    }
    
    .subcategories {
        display: flex !important;
        opacity: 1 !important;
        max-height: none !important;
        padding: 10px 0 !important;
    }
}
/* 模块现代化 */
.mod{margin-top:25px;}
.mod .title{width:100%;height:50px;margin:15px 0;position: relative;}
.mod .title::before {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 60px;
    height: 3px;
    background: var(--bg-gradient-1);
    border-radius: 2px;
}
.mod .title h3{
    float:left;
    font-size:28px;
    color: var(--text-primary);
    line-height:50px;
    font-weight: 700;
}
.mod .title h3 a{color: var(--text-primary);}
.mod .title h3 a:hover{color: var(--primary-color);}
.mod .title h3 em{font-size:28px;padding-right:8px;color: var(--accent-color);}
.mod .title .tags{float:right;}
.mod .title .tags a{
    float:left;
    display:block;
    margin:8px 0 0 12px;
    border-radius:25px;
    padding:8px 16px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    font-weight: 500;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-sm);
}
.mod .title .tags a:hover{
    background: var(--bg-gradient-2);
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}
.mod .title .tags h2{float:left;font-size:14px;}
.mod .title .more{float:right;}
.mod .title .total{float:right;line-height:50px;font-size:16px;text-align:right;font-weight: 500;}
.mod .title .total em{padding:0 8px;color: var(--accent-color);font-weight: 700;}

/* 卡片样式现代化 */
.mod .row dl{
    position:relative;
    display:block;
    float:left;
    border-radius: 12px;
    overflow: hidden;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-sm);
}
.mod .row dl:hover{
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}
.mod .row dt{position:relative;width:100%;background: var(--bg-secondary);border-radius: 12px 12px 0 0;}
.mod .row dt img,.mod .row li img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit: cover;border-radius: 12px 12px 0 0;}
.mod .row dd a{
    display:block;
    width:30%;
    height:48px;
    line-height:48px;
    text-align:center;
    overflow:hidden;
    background: var(--bg-card);
    color: var(--text-primary);
    font-weight: 500;
    border-radius: 0 0 12px 12px;
    transition: all var(--transition-fast);
}
.mod .row dl:hover dd a{color: var(--primary-color);}
.mod .col2,.mod .col3,.mod .col4,.mod .col6{margin-right:-20px;}
.mod .col2 dt a,.mod .col3 dt a,.mod .col4 dt a,.mod .col5 dt a,.mod .col6 dt a{display:block;width:100%;height:100%;border-radius: 12px;}
.mod .col5 img,.mod .col6 img{object-fit:cover;}
.mod .col2 dl{margin:12px 20px 12px 0;width:640px;}
.mod .col2 dt{height:150px;}
.mod .col2 dd,.mod .col3 dd,.mod .col4 dd,.couplet-left span,.couplet-right span{
    display:block;
    position:absolute;
    z-index:6;
    right:8px;
    bottom:8px;
    padding:4px 8px;
    border-radius:6px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    font-size:12px;
    cursor:pointer;
    font-weight: 500;
    backdrop-filter: blur(10px);
}
.mod .col3 dl{margin:12px 20px 12px 0;width:420px;}
.mod .col3 dt{height:180px;}
.mod .col4 dl{margin:12px 20px 12px 0;width:310px;}
.mod .col4 dt{height:150px;}
.mod .col5{margin-right:-12.5px;}
.mod .col5 dl{
    margin:18px 12.5px 18px 0;
    width:250px;
    border-radius: 12px;
    overflow: hidden;
    background: var(--bg-card);
    box-shadow: var(--shadow-sm);
    transition: all var(--transition-normal);
}
.mod .col5 dl:hover{
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
}
.mod .col5 dt{height:140px;}
.mod .col5 dt a:hover:before{background:url(../image/play.png) center no-repeat;}
.mod .col5 dt i{
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    width:auto;
    height:24px;
    padding:12px 12px 6px;
    overflow:hidden;
    background: linear-gradient(0deg, rgba(0,0,0,0.8), rgba(0,0,0,0.4) 25%, rgba(0,0,0,0.1) 70%, rgba(0,0,0,0));
    color: var(--text-white);
    font-size:12px;
    font-style:normal;
    letter-spacing:normal;
    line-height:24px;
    text-overflow:ellipsis;
    white-space:nowrap;
    cursor:pointer;
    font-weight: 500;
}
.mod .col6 dl{margin:18px 20px 18px 0;width:200px;}
.mod .col6 dt{height:280px;}
.mod .col6 dt i{
    display:block;
    position:absolute;
    z-index:2;
    right:8px;
    top:8px;
    padding:4px 8px;
    border-radius:6px;
    background: var(--bg-gradient-3);
    color: var(--text-white);
    font-size:13px;
    font-style:normal;
    letter-spacing:normal;
    font-weight: 600;
}
.mod .col2 dt a:hover:before,.mod .col3 dt a:hover:before,.mod .col4 dt a:hover:before,.mod .col5 dt a:hover:before,.mod .col6 dt a:hover:before{
    content:"";
    position:absolute;
    z-index:1;
    width:100%;
    height:100%;
    background: linear-gradient(135deg, rgba(108, 99, 255, 0.2), rgba(255, 107, 157, 0.2));
    backdrop-filter: blur(2px);
}
.mod .col4 dl h3,.mod .col5 dl h3,.mod .col6 dl h3{
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    font-weight: 600;
}
.mod .col ul{margin:25px 0;}
.mod .col li:nth-of-type(odd){background: var(--bg-gradient-1);}
.mod .col li:nth-of-type(even){background: var(--bg-gradient-2);}
.mod .col li{width:100%;border-radius: 8px;margin-bottom: 4px;overflow: hidden;}
.mod .col li a{
    display:block;
    box-sizing:border-box;
    padding:0 30px;
    height:64px;
    line-height:64px;
    overflow:hidden;
    font-size:16px;
    color: var(--text-white);
    font-weight: 500;
    transition: all var(--transition-fast);
}
.mod .col li a:first-child{border-top: none;}
.mod .col li a:visited{color: rgba(255,255,255,0.8);}
.mod .col li a:hover{
    background: var(--bg-gradient-3);
    transform: translateX(8px);
    box-shadow: var(--shadow-md);
}
.mod .col li em{
    float:left;
    display:block;
    width:30px;
    color: var(--text-white);
    font-size:22px;
    text-align:center;
    font-weight: 700;
}
.mod .col ul{counter-reset:list 0}
.mod .col ul li{counter-increment:list}
.mod .col ul li em:before{content:counter(list,decimal-leading-zero)".";}
.mod .col li h3{
    padding:0 20px;
    font-style:normal;
    font-size:20px;
    white-space:nowrap;
    text-overflow:ellipsis;
    overflow:hidden;
    font-weight: 600;
}
.mod .col li span{float:right;font-size:12px;opacity: 0.9;}

/* 分页现代化 */
.pagination{margin:40px 0 15px 0;}
.pagination{height:40px;line-height:40px;text-align:center;}
.pagination a{
    display:inline-block;
    margin:0 3px;
    padding:0 16px;
    border-radius:8px;
    background: var(--bg-card);
    color: var(--text-primary);
    border: 1px solid var(--border-color);
    transition: all var(--transition-fast);
    font-weight: 500;
}
.pagination a:visited{background: var(--bg-secondary);color: var(--text-secondary);}
.pagination a:hover,.pagination strong{
    background: var(--bg-gradient-1);
    color: var(--text-white);
    transform: translateY(-1px);
    box-shadow: var(--shadow-sm);
}
.pagination strong{
    display:inline-block;
    margin:0 3px;
    padding:0 16px;
    border-radius:8px;
    height:40px;
    line-height:40px;
    font-weight: 600;
    border: 1px solid var(--primary-color);
}

/* 主内容区现代化 */
.main h1{
    padding:15px 0;
    color: var(--text-primary);
    font-size:40px;
    text-align:center;
    overflow:hidden;
    font-weight: 700;
    background: var(--bg-gradient-1);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}
.main .content{
    border-top:1px solid var(--border-color);
    border-bottom:1px solid var(--border-color);
    padding:20px 0;
    line-height:1.8;
    text-align:left;
    font-size:18px;
    background: var(--bg-card);
    border-radius: 12px;
    margin: 20px 0;
    box-shadow: var(--shadow-sm);
}
.main .content::first-letter{
    display:block;
    float:left;
    margin:0 15px 0 -1.5em;
    font-size:320%;
    line-height:90px;
    color: var(--primary-color);
    font-weight: 700;
}
.main .content img{
    display:block;
    margin:25px auto;
    width:expression(this.width> 1300 ? 1300 : true);
    background: var(--bg-secondary);
    border-radius: 12px;
    box-shadow: var(--shadow-sm);
}
.main .content p{padding:15px 0;}
.main .content br{display:inline;line-height:35px;}
.main .content ul{width:100%;margin-top:25px;}
.main .content li{float:left;margin-right:12px;font-size:14px;}
.main .content li a{
    display:block;
    padding:10px 18px;
    border-radius:20px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    font-weight: 500;
    transition: all var(--transition-normal);
}
.main .content li a:visited{background: var(--bg-secondary);color: var(--text-secondary);}
.main .content li a:hover{
    background: var(--bg-gradient-2);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.main .content .player{width:100%;margin:0 auto;position:relative;border-radius: 12px;overflow: hidden;}
.main .content .player-wrap{padding-bottom:56.25%;width:100%;height:0;}
.main .content .player-box{position:absolute;left:0;top:0;width:100%;height:100%;}
.main .post-link{margin:25px 0 15px 0;height:48px;line-height:48px;font-size:16px;}
.main .post-link h2{display:inline;font-weight: 600;}
.main .post-link a{overflow:hidden;transition: all var(--transition-fast);}
.main .post-link .prev{float:left;text-align:left;}
.main .post-link .next{float:right;text-align:right;}

/* 顶部和底部区域 */
#topBox{background: var(--bg-secondary);}
#topBox .mod,#btmBox .mod{margin:0 auto;}
.player-tips{
    position:absolute;
    z-index:10000;
    padding-bottom:56.25%;
    width:100%;
    height:0;
    background: rgba(0,0,0,0.9);
    font-size:16px;
    text-align:center;
    backdrop-filter: blur(20px);
}
.player-tips dl{
    position:absolute;
    left:50%;
    top:50%;
    margin-left:-320px;
    margin-top:-220px;
    box-sizing:border-box;
    width:640px;
    height:440px;
    padding:30px 0;
    background: var(--bg-card);
    border-radius: 20px;
    box-shadow: var(--shadow-lg);
}
.player-tips a{position:absolute;display:block;z-index:8;width:100%;height:100%;}
.player-tips .title{font-size:28px;color: var(--primary-color);font-weight: 700;}
.player-tips .icon{
    margin:0 auto;
    margin-top:25px;
    width:200px;
    height:200px;
    background:url(../image/kdsp.png) no-repeat 0 0 / 100% 100%;
    border-radius: 20px;
    box-shadow: var(--shadow-md);
}
.player-tips .icon a{display:block;width:200px;height:200px;}
.player-tips .download{margin-top:20px;text-align:center;font-size:14px;}
.player-tips .download span{
    padding:12px 35px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    border-radius:25px;
    font-weight: 500;
    transition: all var(--transition-normal);
}
.player-tips .download a:hover{
    background: var(--bg-gradient-2);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.player-tips .btn-close{
    position:absolute;
    cursor:pointer;
    z-index:9;
    top:0;
    right:0;
    width:48px;
    height:48px;
    line-height:48px;
    color: var(--text-secondary);
    font-size:20px;
    text-align:center;
    transition: all var(--transition-fast);
}
.player-tips .btn-close:hover{
    color: var(--primary-color);
    transform: scale(1.1);
}

/* 侧边广告现代化 */
.couplet-left,.couplet-right{position:fixed;top:30%;margin:5px;z-index:70;}
.couplet-left{left:0;}
.couplet-right{right:0;}
.couplet-left li,.couplet-right li{position:relative;width:150px;height:350px;border-radius: 12px;overflow: hidden;}
.couplet-left a,.couplet-right a{
    position:absolute;
    z-index:3;
    width:150px;
    height:350px;
    background: transparent;
    transition: all var(--transition-normal);
}
.couplet-left a:hover,.couplet-right a:hover{
    background: rgba(0,0,0,0.3);
    backdrop-filter: blur(4px);
}
.couplet-left .btn-close,.couplet-right .btn-close{
    position:absolute;
    cursor:pointer;
    top:0;
    right:0;
    padding:4px 8px;
    background: rgba(0,0,0,0.7);
    color: var(--text-white);
    opacity:.9;
    z-index:5;
    border-radius: 0 12px 0 8px;
    transition: all var(--transition-fast);
}
.couplet-left .btn-close:hover,.couplet-right .btn-close:hover{
    background: var(--primary-color);
    opacity: 1;
}

/* 底部现代化 */
.footer{
    margin-top:40px;
    padding:80px 0;
    line-height:35px;
    text-align:center;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    position: relative;
}
.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0));
    pointer-events: none;
}

/* APP提示框现代化 */
#appBox{position:fixed;display:none;left:0;bottom:0.62rem;right:0;width:100%;min-height:0.2rem;z-index:11001;}
#appBox.show{display:block;animation:fadein 0.3s,fadeout 0.5s 11.7s;}
@keyframes fadein{from{opacity:0;bottom:0;}to{opacity:1;bottom:30px;}}
@keyframes fadeout{from{bottom:30px;opacity:1;}to{bottom:0;opacity:0;}}
@keyframes fade{
    0%{opacity:1.0;transform: scale(1);}
    50%{opacity:0.9;transform: scale(1.02);background: var(--bg-gradient-3);}
    100%{opacity:1.0;transform: scale(1);}
}
.app-tips{
    position:relative;
    cursor:pointer;
    margin-top:12px;
    border-radius:12px;
    background: var(--bg-gradient-3);
    padding:12px;
    color: var(--text-white);
    font-size:14px;
    line-height:28px;
    text-align:center;
    animation:fade 800ms infinite;
    font-weight: 500;
    box-shadow: var(--shadow-md);
}
.app-tips .btn-close{
    position:absolute;
    cursor:pointer;
    z-index:9;
    right:0;
    padding:2px;
    margin-right:12px;
    color: var(--text-white);
    font-size:16px;
    line-height:24px;
    transition: all var(--transition-fast);
}
.app-tips .btn-close:hover{
    transform: scale(1.2);
    color: rgba(255,255,255,0.8);
}

/* 字体族保持 */
.nav .domain,.mod .title .count em,.mod .row i,.mod .col li em,.mod .col li span,.pagination .mobile{font-family:'Voltaire','Book Antiqua';}

/* 导航按钮现代化 */
.guide{position:fixed;display:block;right:20px;bottom:20px;z-index:90;}
.guide a{
    display:block;
    margin-top:12px;
    width:52px;
    height:52px;
    line-height:52px;
    background: var(--bg-gradient-1);
    font-size:22px;
    text-align:center;
    opacity:.95;
    border-radius: 50%;
    box-shadow: var(--shadow-lg);
    color: var(--text-white);
    transition: all var(--transition-normal);
}
.guide a:hover{
    background: var(--bg-gradient-2);
    transform: translateY(-3px) scale(1.05);
    box-shadow: 0 8px 30px rgba(108, 99, 255, 0.3);
}

/* 弹窗现代化 */
.mask{position:fixed;width:100%;height:100%;left:0;top:0;background:rgba(0,0,0,.6);overflow-y:scroll;cursor:pointer;backdrop-filter: blur(8px);}
.pop{
    position:fixed;
    left:50%;
    top:50%;
    margin-left:-180px;
    margin-top:-220px;
    border-radius:20px;
    width:360px;
    height:460px;
    background: var(--bg-card);
    font-size:14px;
    text-align:center;
    z-index:11001;
    box-shadow: var(--shadow-lg);
    border: 1px solid rgba(255,255,255,0.2);
    backdrop-filter: blur(20px);
}
.pop dt{margin-top:25px;height:44px;line-height:44px;font-size:22px;color: var(--text-primary);font-weight: 700;}
.pop dd{margin:15px;}
.pop .sub-title{line-height:28px;color: var(--text-secondary);}
.pop .url{
    cursor:pointer;
    margin:12px 25px;
    border-radius:8px;
    padding:0 15px;
    height:38px;
    line-height:38px;
    background: var(--bg-secondary);
    color: var(--text-primary);
    text-transform:lowercase;
    font-weight: 500;
    transition: all var(--transition-fast);
}
.pop .url:hover{background: var(--bg-hover);color: var(--primary-color);}
.pop em{color: var(--primary-color);font-size:14px;font-weight: 600;}
.pop .all{margin-top:30px;text-align:center;}
.pop .all a{
    padding:12px 35px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    border-radius:25px;
    font-weight: 500;
    transition: all var(--transition-normal);
}
.pop .all a:hover{
    background: var(--bg-gradient-2);
    transform: translateY(-2px);
    box-shadow: var(--shadow-md);
}
.pop .btn-close{margin:0 auto;margin-top:60px;width:48px;height:48px;line-height:48px;}
.pop .btn-close a{
    display:block;
    background: var(--bg-secondary);
    color: var(--text-secondary);
    font-size:20px;
    text-align:center;
    border-radius: 50%;
    transition: all var(--transition-fast);
}
.pop .btn-close a:hover{
    background: var(--primary-color);
    color: var(--text-white);
    transform: scale(1.1);
}

/* 搜索框现代化 */
.pd5{padding: 8px;}
.inputsearch{
    margin: 2px;
    border-radius: 12px;
    border: 1px solid var(--border-color);
    padding: 0 16px;
    height: 44px;
    line-height: 44px;
    background: var(--bg-card);
    color: var(--text-primary);
    margin-top: 12px;
    text-transform: lowercase;
    font-weight: 500;
    transition: all var(--transition-fast);
    box-shadow: var(--shadow-sm);
}
.inputsearch:focus{
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(108, 99, 255, 0.1);
    outline: none;
}
.w100{width:100%}
.pre{position: relative;}
.pou{
    position:absolute;
    bottom: 2px;
    width:85px;
    height:44px;
    line-height:44px;
    text-align:center;
    border-radius:0 10px 10px 0;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    right: 0;
    border: none;
    font-weight: 600;
    transition: all var(--transition-fast);
    cursor: pointer;
}
.pou:hover{
    background: var(--bg-gradient-2);
    transform: scale(1.02);
    
}
/* 播放按钮现代化 */
.play-section {
    margin: 40px 0;
    text-align: center;
}

.play-btn-container {
    display: inline-block;
    position: relative;
}

.play-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    position: relative;
    padding: 18px 35px;
    border: none;
    border-radius: 50px;
    background: var(--bg-gradient-1);
    color: var(--text-white);
    font-size: 18px;
    font-weight: 600;
    text-decoration: none;
    overflow: hidden;
    transition: all var(--transition-normal);
    box-shadow: var(--shadow-lg);
    cursor: pointer;
    min-width: 180px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-family: 'Segoe UI', 'Microsoft Yahei', sans-serif;
}

.play-btn:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 35px rgba(108, 99, 255, 0.4);
    background: var(--bg-gradient-2);
    color: var(--text-white);
}

.play-btn:active {
    transform: translateY(-1px);
    box-shadow: var(--shadow-md);
}

.play-icon {
    margin-right: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
}

.play-text {
    font-family: 'Segoe UI', 'Microsoft Yahei', sans-serif;
    font-weight: 600;
}

.play-ripple {
    position: absolute;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.6);
    transform: scale(0);
    animation: ripple 0.6s linear;
    pointer-events: none;
}

@keyframes ripple {
    to {
        transform: scale(4);
        opacity: 0;
    }
}

.play-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    border-radius: 50px;
    padding: 2px;
    background: var(--bg-gradient-3);
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    animation: glow 2s ease-in-out infinite alternate;
    opacity: 0;
}

.play-btn:hover::before {
    opacity: 1;
}

@keyframes glow {
    0% {
        filter: blur(5px);
        opacity: 0.8;
    }
    100% {
        filter: blur(12px);
        opacity: 0.4;
    }
}

/* 夜色模式适配 */
@media (prefers-color-scheme: dark) {
    :root {
        --primary-color: #8b83ff;
        --primary-light: #a39bff;
        --primary-dark: #7069ff;
        --secondary-color: #ff8cc8;
        --accent-color: #5ae4ff;
        
        --bg-primary: #0f1419;
        --bg-secondary: #1a202c;
        --bg-card: #1a202c;
        --bg-hover: #2d3748;
        
        --text-primary: #f7fafc;
        --text-secondary: #cbd5e0;
        --text-light: #a0aec0;
        
        --border-color: #4a5568;
        --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.3);
        --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
        --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5);
    }
    
    body {
        background-color: var(--bg-primary);
        color: var(--text-primary);
    }
    
    .subcategories {
        background: var(--bg-secondary);
    }
    
    .subcategory-link:hover {
        background: var(--bg-gradient-1);
        color: white;
        box-shadow: var(--shadow-md);
    }
    
    .main h1 {
        background: var(--bg-gradient-1);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
        background-clip: text;
    }
}

/* 响应式设计保持原有媒体查询并优化 */
@media screen and (max-width:1366px){
	.guide{left:unset;right:0;margin:0 1.5% 0;bottom:20px;}
	#couplet{display:none;}
	.couplet-left,.couplet-right{margin:0 33px;}
}

@media screen and (max-width:1280px){
	a,a:hover,a:active,a:visited,a:link,a:focus{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-tap-highlight-color:transparent;outline:none;text-decoration:none;}
	.pc{display:none;}
	.mt{display:inline;}
	.wrap{width:100%;}
	.guide a:hover{background: var(--bg-gradient-2);color: var(--text-white);}
	.nav,.menu,.mod,.main,.category-nav{width:97%;margin-left:1.5%;margin-right:1.5%;}
	.nav .logo{min-width:25%;padding: 12px 0;}
	.nav .btn-icon{width:68%;padding:12px 0;}
	.nav .btn-icon li{height:100%;}
	.nav .btn-icon li .tips{left:0;margin-left:0;margin-top:32px;}
	.nav .btn-icon li .tips:before,.nav .btn-icon li .tips:after{left:60px;margin-left:0;top:-16px;}
	.nav .btn-icon li:last-child .tips{left:unset;right:0;}
	.nav .btn-icon li:last-child .tips:before,.nav .btn-icon li:last-child .tips:after{left:unset;right:60px;margin-left:0;top:-16px;}
	.menu{margin-top:25px;}
	.menu dt:after{margin:18px 2.1% 0;}
	.mod .row a:hover:before{display:none;}
	.mod .col2{margin:0;}
	.mod .col2 dl{width:48.5%;}
	.mod .col2 dt{padding-bottom:23.43%;}
	.mod .col3{margin:0;}
	.mod .col3 dl{width:31.83%;}
	.mod .col3 dt{padding-bottom:42.86%;}
	.mod .col4{margin-top:0;}
	.mod .col4 dl{width:23.5%;}
	.mod .col4 dt{padding-bottom:48.38%;}
	.mod .col5 dl{width:31.83%;}
	.mod .col5 dt{padding-bottom:56.25%;}
	.mod .col6 dl{width:23.5%;}
	.mod .col6 dt{padding-bottom:140%;}
	.mod .col2,.mod .col3,.mod .col4,.mod .col5,.mod .col6{margin-right:-1.5%;}
	.mod .col2 dl,.mod .col3 dl,.mod .col4 dl,.mod .col5 dl,.mod .col6 dl{margin:0.75% 1.5% 0.75% 0;}
	.mod .col2 dt,.mod .col3 dt,.mod .col4 dt,.mod .col5 dt,.mod .col6 dt{width:100%;height:0;}
	.mod .col2 dd,.mod .col3 dd,.mod .col4 dd{display:none;}
	.pagination{margin:30px 0 20px 0;}
	.main h1{font-size:32px;}
	.main .content img{max-width:100%;}
	.footer{margin-top:20px;}
	.couplet-left,.couplet-right{margin:0 1.5% 3% 1.5%;}
	.couplet-left li,.couplet-right li,.couplet-left a,.couplet-right a,.couplet-left img,.couplet-right img{width:10vw;height:23vw;}
	
	/* 分类导航响应式优化 */
	.category-nav{
		padding: 15px;
		border-radius: 12px;
	}
	.category-header{
		padding: 12px 15px;
	}
	.category-title a{
		font-size: 16px;
	}
	.subcategories.show{
		padding: 15px;
	}
	.subcategory-link{
		font-size: 13px;
		padding: 6px 12px;
	}
}

@media screen and (max-width:760px){
	.mobile{display:none;}
	.guide a{width:48px;height:48px;line-height:48px;font-size: 20px;}
	.nav li{padding:0 0;}
	.nav .logo{width:100%;}
	.nav .url{float:none;text-align:center;}
	.nav .btn-icon{width:100%;display:block;}
	.nav .btn-icon li{height:100%;}
	.nav .btn-icon li i{height:36px;line-height:36px;font-size:36px;padding:0px 0 0px 0;}
	.nav .btn-icon li .tips{margin-top:22px;}
	.nav .btn-icon li .tips:before,.nav .btn-icon li .tips:after{left:30px;}
	.nav .btn-icon li:last-child .tips:before,.nav .btn-icon li:last-child .tips:after{right:30px;}
	.menu{margin:20px 0 0;border-radius:8px;padding:0;width:100%;}
	.menu dl{padding:8px 0;}
	.menu dt{width:20%;line-height:56px;font-size:16px;font-weight:600;}
	.menu dt:after{margin:20px 3% 0;}
	.menu dd{width:20%;line-height:32px;font-size:14px;}
	.mod .title h3{font-size:24px;}
	.mod .row span,.couplet-left span,.couplet-right span{display:none;}
	.mod .col li a{padding:0 15px;height: 56px;line-height: 56px;}
	.mod .col li h3{padding:0 15px;font-size:16px;}
	.mod .col2{margin:6px 0;}
	.mod .col2 dl{width:100%;margin:6px 0;}
	.mod .col2 dt{padding-bottom:23.43%;width:100%;height:0;}
	.mod .col2 dd{display:none;}
	.mod .col3 dl:first-child{width:98.5%;}
	.mod .col3 dl:first-child dt{padding-bottom:48%;}
	.mod .col3 dt{padding-bottom:56.25%;}
	.mod .col4{margin-top:0;}
	.mod .col4 dt{padding-bottom:56.25%;width:100%;height:0;}
	.mod .col5 dl h3,.mod .col6 dl h3{font-size:14px;}
	.mod .col5 dt{padding-bottom:56.25%;width:100%;height:0;}
	.mod .col5 dl:first-child dt{padding-bottom:56%;}
	.mod .col4,.mod .col5,.mod .col6{margin-right:-1.5%;}
	.mod .col3 dl,.mod .col4 dl,.mod .col5 dl,.mod .col6 dl{width:48.5%;margin:1.5% 1.5% 1.5% 0;}
	.mod .col6 dt{padding-bottom:140%;width:100%;height:0;}
	.index-list .col5 dl:first-child,.channel-list .col5 dl:nth-child(5n+1){width:98.5%;}
	.index-list .col5 dl:nth-last-child(-n+2),.index-list .col6 dl:nth-last-child(-n+2),.channel-list .col5 dl:nth-last-child(-n+2),.play-list .col5 dl:nth-last-child(-n+1){display:block;}
	.index-list .col5 dl:nth-last-child(-n+1){display:none;}
	.main h1{font-size:22px;padding:20px 0;}
	.main .content{line-height:1.7;font-size:16px;padding: 15px;}
	.main .content::first-letter{font-size:280%;line-height:60px;}
	.main .post-link{height:44px;line-height:44px;font-size:14px;}
	.main .post-link a{width:49.25%;display:block;border-radius:8px;background: var(--bg-gradient-1);color: var(--text-white);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding: 0 10px;}
	.main .post-link a:visited{background: var(--bg-secondary);color: var(--text-secondary);}
	.main .post-link .prev{float:left;text-align:center;}
	.main .post-link .next{float:right;text-align:center;}
	.footer{margin-top:15px;padding:60px 0;}
	.player-tips{font-size:14px;}
	.player-tips dl{position:static;left:0;top:0;margin-left:0;margin-top:0;width:100%;height:100%;padding:0;}
	.player-tips .title{font-size:20px;padding-top:15px;}
	.player-tips .icon{margin-top:15px;width:80px;height:80px;}
	.player-tips .icon a{width:80px;height:80px;}
	.couplet-left,.couplet-right{top:unset;bottom:16%;}
	.couplet-left li,.couplet-right li,.couplet-left a,.couplet-right a,.couplet-left img,.couplet-right img{width:20vw;height:46vw;}
	
	/* 分类导航移动端优化 */
	.category-nav{
		padding: 12px;
		margin: 15px 0;
		border-radius: 8px;
	}
	.category-item{
		margin-bottom: 8px;
		border-radius: 8px;
	}
	.category-header{
		padding: 10px 12px;
	}
	.category-title a{
		font-size: 15px;
	}
	.toggle-btn{
		width: 36px;
		height: 36px;
		margin-left: 8px;
	}
	.arrow{
		width: 10px;
		height: 10px;
	}
	.subcategories{
		gap: 6px;
		padding: 0 12px;
	}
	.subcategories.show{
		padding: 12px;
	}
	.subcategory-link{
		font-size: 12px;
		padding: 5px 10px;
		border-radius: 15px;
	}
	
	/* 播放按钮移动端优化 */
	.play-btn {
		padding: 14px 28px;
		font-size: 16px;
		min-width: 160px;
	}
	
	.play-icon {
		width: 22px;
		height: 22px;
		margin-right: 8px;
	}
	
	/* 搜索框移动端优化 */
	.inputsearch{
		height: 40px;
		line-height: 40px;
		padding: 0 12px;
		border-radius: 8px;
	}
	.pou{
		height: 40px;
		line-height: 40px;
		width: 75px;
		border-radius: 0 6px 6px 0;
	}
}

/* 超小屏幕优化 */
@media screen and (max-width: 480px) {
    .category-nav{
        padding: 8px;
        margin: 10px 0;
    }
    .category-header{
        padding: 8px 10px;
    }
    .category-title a{
        font-size: 14px;
    }
    .toggle-btn{
        width: 32px;
        height: 32px;
    }
    .subcategories.show{
        padding: 10px;
    }
    .subcategory-link{
        font-size: 11px;
        padding: 4px 8px;
    }
    
    .play-btn {
        padding: 12px 24px;
        font-size: 14px;
        min-width: 140px;
    }
    
    .mod .title h3{
        font-size: 20px;
    }
    
    .main h1{
        font-size: 18px;
    }
}

/* 加载状态和过渡动画优化 */
.category-item.loading .toggle-btn {
    pointer-events: none;
}

.category-item.loading .arrow {
    animation: spin 1s linear infinite;
}

@keyframes spin {
    from { transform: rotate(45deg); }
    to { transform: rotate(405deg); }
}

/* 无障碍访问和动画偏好 */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
    
    .category-item:hover {
        transform: none;
    }
    
    .subcategory-link:hover {
        transform: none;
    }
    
    .toggle-btn:hover {
        transform: none;
    }
    
    .play-btn:hover {
        transform: none;
    }
}

/* 打印样式 */
@media print {
    .category-nav {
        box-shadow: none;
        border: 1px solid #000;
    }
    
    .subcategories {
        display: flex !important;
        opacity: 1 !important;
        max-height: none !important;
        padding: 0.5em !important;
    }
    
    .toggle-btn {
        display: none;
    }
    
    .guide {
        display: none;
    }
    
    .couplet-left, .couplet-right {
        display: none;
    }
}

/* 高对比度模式 */
@media (prefers-contrast: high) {
    .category-item {
        border: 2px solid;
    }
    
    .subcategory-link {
        border: 1px solid;
    }
    
    .toggle-btn:focus {
        box-shadow: 0 0 0 3px;
    }
    
    .play-btn {
        border: 2px solid;
    }
}