/* site overrides */
header .logo {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    overflow: hidden;
}

header .logo h1 {
    display: block;
    font-size: 1.125rem;
    line-height: 1.2;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* cover date badge */
.column-list .list .time {
    padding: 0 .35rem;
    color: #fff;
    background-color: rgba(0, 0, 0, .6);
    border-radius: 3px;
}

/* search */
.search-form {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: .5rem;
}

.search-form .keywd {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    min-width: 0;
    height: 2.25rem;
    padding: 0 .75rem;
    font-size: .875rem;
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px 0 0 4px;
}

.search-form select {
    height: 2.25rem;
    max-width: 7.5rem;
    padding: 0 .35rem;
    font-size: .8125rem;
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-left: 0;
}

.search-form button {
    height: 2.25rem;
    padding: 0 1.25rem;
    font-size: .875rem;
    color: #fff;
    background-color: #085ca5;
    border-radius: 0 4px 4px 0;
}

.search-form button:hover {
    background-color: #0450b9;
}

/* player */
.panel .window {
    position: relative;
    padding-bottom: 56.25%;
    margin-top: .5rem;
    overflow: hidden;
    background-color: #000;
    border-radius: 4px;
}

.panel .window #mac-player {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
}

.panel .window #mac-player iframe,
.panel .window #mac-player video {
    width: 100%;
    height: 100%;
    border: 0;
}

/* detail poster */
.poster-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: .5rem 0;
}

.poster-box a {
    position: relative;
    display: block;
    max-width: 100%;
    border-radius: 4px;
    overflow: hidden;
}

.poster-box img {
    display: block;
    width: auto;
    max-width: 100%;
    max-height: 22rem;
}

.poster-play {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 3rem;
    height: 3rem;
    line-height: 3rem;
    margin: -1.5rem 0 0 -1.5rem;
    font-size: 1.25rem;
    text-align: center;
    color: #fff;
    background-color: rgba(0, 0, 0, .5);
    border-radius: 50%;
}

.js-play-list .sub-tag {
    margin-bottom: .5rem;
}

/* category tags */
.sub-tag .tag-head {
    display: block;
    padding: .15rem .6rem;
    font-size: .8125rem;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    color: #333;
    background-color: #f9da9a;
    border: 1px solid #f9da9a;
    border-radius: 4px;
}

/* 标签宽度跟随文字长度，不再固定分栏 */
.sub-tag li {
    width: auto;
    min-width: 0;
    padding: .15rem .1rem;
}

.sub-tag li a {
    display: block;
    max-width: 100%;
    padding: .15rem .6rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* play breadcrumb: 首页 > 分类 > 片名，单行显示，片名超长省略 */
.column-head--crumb {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    overflow: hidden;
}

.breadcrumb {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    min-width: 0;
    font-size: .875rem;
    white-space: nowrap;
}

.breadcrumb a,
.breadcrumb .sep {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
}

.breadcrumb a {
    color: #555;
}

.breadcrumb a:hover {
    color: #085ca5;
}

.breadcrumb .sep {
    margin: 0 .3rem;
    color: #999;
}

.breadcrumb .current {
    -webkit-box-flex: 1;
    -ms-flex: 1 1 auto;
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
    color: #333;
}

/* 播放页多线路：单行排列，超出宽度横向滚动 */
.sort--player {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    -ms-overflow-style: none;
}

.sort--player::-webkit-scrollbar {
    display: none;
}

.sort--player a {
    /* 不随线路数量拉伸，尺寸固定 */
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    min-width: 5.5rem;
    white-space: nowrap;
    /* 线路按钮：主题色胶囊 */
    color: #fff;
    background-color: #2d7a72;
    border: 1px solid #2d7a72;
    border-radius: 4px;
}

.sort--player a:hover:not(.active) {
    color: #fff;
    background-color: #24635c;
    border-color: #24635c;
}

/* 当前播放线路：主题色加深 */
.sort--player a.active {
    color: #fff;
    background-color: #1b4f49;
    border-color: #1b4f49;
}

@media screen and (max-width: 767px) {
    header .logo h1 {
        font-size: 1rem;
    }

    .sort--player a {
        min-width: 4.5rem;
        font-size: .75rem;
    }

    .search-form select {
        max-width: 5.5rem;
    }

    .search-form button {
        padding: 0 .85rem;
    }

    /* 分页：移动端强制单行，按钮等分宽度并缩小字号 */
    .page {
        -ms-flex-wrap: nowrap;
        flex-wrap: nowrap;
    }

    .page li {
        -webkit-box-flex: 1;
        -ms-flex: 1 1 0;
        flex: 1 1 0;
        min-width: 0;
        padding: 0 .125rem;
    }

    .page li a {
        width: 100%;
        min-width: 0;
        padding: .3rem .1rem;
        font-size: .75rem;
    }
}

/* 分页：单行显示，避免移动端“上一页/下一页”被挤压 */
.page {
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding-top: .5rem;
    padding-bottom: .4rem;
    margin-bottom: .25rem;
}

.page li a {
    white-space: nowrap;
}

/* 分页跳转 */
.page-jump {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-bottom: 1rem;
    font-size: .8125rem;
    color: #666;
}

.page-jump__label {
    margin-right: .5rem;
}

.page-jump__input {
    width: 4rem;
    height: 1.85rem;
    padding: 0 .35rem;
    font-size: .8125rem;
    color: #555;
    text-align: center;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.page-jump__input:focus {
    border-color: #085ca5;
    outline: none;
}

.page-jump__btn {
    height: 1.85rem;
    margin-left: .35rem;
    padding: 0 .85rem;
    font-size: .8125rem;
    color: #fff;
    background-color: #085ca5;
    border: 0;
    border-radius: 4px;
    cursor: pointer;
}

.page-jump__btn:hover {
    background-color: #0450b9;
}

/* 分类页“站长推荐”友情链接 */
.links-box {
    margin-top: 1rem;
}

.links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    gap: .3rem;
    padding: .5rem .6rem;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.links li {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
}

.links li a {
    display: block;
    padding: .15rem .6rem;
    font-size: .8125rem;
    color: #fff;
    white-space: nowrap;
    background-color: #2d7a72;
    border: 1px solid #2d7a72;
    border-radius: 4px;
}

.links li a:hover {
    color: #fff;
    background-color: #24635c;
    border-color: #24635c;
}

/* 底部友情链接 */
footer .foot-links {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: .25rem .5rem .5rem;
    font-size: .8125rem;
    color: #999;
    gap: .3rem;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
}

footer .foot-links .column-head {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%;
    text-align: left;
}

footer .foot-links .column-head .text {
    padding: 0;
    color: #333;
}

footer .foot-links a {
    display: inline-block;
    padding: .15rem .6rem;
    font-size: .8125rem;
    color: #fff;
    white-space: nowrap;
    background-color: #2d7a72;
    border: 1px solid #2d7a72;
    border-radius: 4px;
}

footer .foot-links a:hover {
    color: #fff;
    background-color: #24635c;
    border-color: #24635c;
}
