:root {
    --tx-midnight: #101521;
    --tx-midnight-2: #1b2231;
    --tx-coral: #ff5b57;
    --tx-coral-deep: #e94848;
    --tx-cream: #fff5e7;
    --tx-paper: #fbfaf7;
    --tx-ink: #171b24;
    --tx-muted: #6d7078;
    --tx-line: rgba(16, 21, 33, .1);
    --tx-card: rgba(255, 255, 255, .86);
    --tx-display: "Iowan Old Style", "Baskerville", "Noto Serif SC", "Songti SC", serif;
    --tx-body: "Avenir Next", "PingFang SC", "Microsoft YaHei UI", sans-serif;
    --tpl-accent: var(--tx-coral);
    --tpl-radius: 12px;
    --tpl-radius-cover: 16px;
}

html {
    color-scheme: light;
    scroll-behavior: smooth;
}

body {
    color: var(--tx-ink);
    background:
        radial-gradient(circle at 4% 3%, rgba(255, 91, 87, .07), transparent 24rem),
        linear-gradient(180deg, #fff 0, var(--tx-paper) 38rem);
    font-family: var(--tx-body);
    text-rendering: optimizeLegibility;
}

body.bstem {
    color-scheme: dark;
    --tx-ink: #f6f0e8;
    --tx-muted: #aeb2bb;
    --tx-line: rgba(255, 255, 255, .09);
    --tx-card: rgba(27, 34, 49, .88);
    background: var(--tx-midnight);
}

:focus-visible {
    outline: 3px solid rgba(255, 91, 87, .42);
    outline-offset: 3px;
}

.container {
    max-width: 1460px;
}

.head_box {
    border-bottom: 1px solid var(--tx-line);
    background: rgba(255, 255, 255, .88) !important;
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
}

.bstem .head_box,
.bstem .head_box.nav_top {
    background: rgba(16, 21, 33, .9) !important;
}

.head_logo,
.head_logo .mac-logo,
.head_logo .logo {
    width: auto !important;
}

.mac-logo.mac-logo--head-pending .tx-brand-lockup > *,
.mac-logo.mac-logo--foot-pending .tx-brand-lockup > * {
    visibility: visible !important;
}

.tx-brand-lockup {
    display: inline-flex !important;
    align-items: center;
    gap: 10px;
    height: 52px;
    color: var(--tx-midnight) !important;
    text-decoration: none;
}

.bstem .tx-brand-lockup {
    color: var(--tx-cream) !important;
}

.tx-brand-lockup .tx-brand-mark {
    display: block;
    width: 42px !important;
    height: 42px !important;
    max-width: none !important;
    object-fit: contain;
}

.tx-brand-wordmark {
    display: grid;
    gap: 1px;
    min-width: max-content;
    line-height: 1;
}

.tx-brand-wordmark strong {
    color: inherit;
    font-family: var(--tx-display);
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .05em;
}

.tx-brand-wordmark small {
    color: var(--tx-coral);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .17em;
}

.head_menu_a a,
.top_nav_overlay_item {
    font-weight: 650;
    letter-spacing: .02em;
}

.head_menu_a li.active > a,
.head_menu_a a:hover,
.top_nav_overlay_item:hover {
    color: var(--tx-coral) !important;
}

.home-unified .box,
.pannel,
.mac-catalog-show__panel,
.detail_list {
    border: 1px solid var(--tx-line);
    border-radius: 20px;
    background: var(--tx-card);
    box-shadow: 0 18px 54px rgba(16, 21, 33, .055);
}

.bstem .home-unified .box,
.bstem .pannel,
.bstem .mac-catalog-show__panel,
.bstem .detail_list {
    background: var(--tx-card) !important;
    box-shadow: 0 22px 68px rgba(0, 0, 0, .22);
}

.home-unified-section-head h2,
.pannel_head > .title,
.article_title,
.content_detail .title,
.list_type_title {
    font-family: var(--tx-display);
    font-weight: 800;
    letter-spacing: -.02em;
}

.home-unified-section-head {
    position: relative;
    padding-bottom: 10px;
}

.home-unified-section-head::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    width: 42px;
    height: 3px;
    border-radius: 99px;
    background: var(--tx-coral);
}

.vodlist_thumb,
.topiclist_thumb,
.searchlist_item .vodlist_thumb {
    overflow: hidden;
    border: 1px solid var(--tx-line);
    border-radius: 16px;
    background-color: #e9e5de;
    box-shadow: 0 12px 28px rgba(16, 21, 33, .09);
    transition: transform .24s ease, box-shadow .24s ease;
}

@media (hover:hover) and (pointer:fine) {
    .vodlist_item:hover .vodlist_thumb,
    .topiclist_item:hover .topiclist_thumb {
        transform: translateY(-4px);
        box-shadow: 0 20px 40px rgba(16, 21, 33, .16);
    }
}

.vodlist_title,
.vodlist_title a {
    color: var(--tx-ink) !important;
    font-weight: 720;
}

.vodlist_sub,
.text_muted,
.content_detail .data {
    color: var(--tx-muted) !important;
}

.pc_more,
.home-refresh-btn,
.page a,
.page .num {
    border-color: var(--tx-line) !important;
    border-radius: 999px !important;
}

.pc_more:hover,
.home-refresh-btn:hover,
.page .active .num,
.page a:hover {
    color: #fff !important;
    border-color: var(--tx-coral) !important;
    background: var(--tx-coral) !important;
}

.detail_list_box {
    padding-top: 38px;
}

.detail_list {
    overflow: hidden;
    background:
        radial-gradient(circle at 84% 10%, rgba(255, 91, 87, .14), transparent 24rem),
        linear-gradient(135deg, #fff 0, #fff9ef 100%);
}

.bstem .detail_list {
    background:
        radial-gradient(circle at 84% 10%, rgba(255, 91, 87, .15), transparent 24rem),
        linear-gradient(135deg, #1b2231 0, #101521 100%) !important;
}

.content_detail .playbtn a,
.playbtn .btn {
    border-radius: 999px !important;
}

#play_page .play_boxbg {
    background:
        radial-gradient(circle at 15% -10%, rgba(255, 91, 87, .22), transparent 30rem),
        var(--tx-midnight) !important;
}

#play_page .player_video {
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 18px 18px 0 0;
    box-shadow: 0 24px 80px rgba(0, 0, 0, .32);
}

#play_page .play_but {
    border-radius: 0 0 18px 18px;
}

.mac-catalog-show__panel {
    padding: 18px;
}

.foot {
    margin-top: 56px;
    border-top: 1px solid var(--tx-line);
    background: transparent !important;
}

.tx-catalog-intro {
    margin: 22px 0 18px;
    padding: clamp(22px, 4vw, 42px);
    border: 1px solid rgba(18, 24, 38, .1);
    border-radius: 28px;
    background:
        linear-gradient(120deg, rgba(255, 92, 92, .13), transparent 42%),
        linear-gradient(135deg, #fffaf1, #ffffff);
    box-shadow: 0 20px 60px rgba(18, 24, 38, .07);
}

.tx-catalog-intro__eyebrow {
    margin: 0 0 9px;
    color: var(--tx-coral);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .16em;
}

.tx-catalog-intro h1 {
    margin: 0;
    color: var(--tx-midnight);
    font-family: var(--tx-display);
    font-size: clamp(30px, 5vw, 54px);
    line-height: 1.05;
    letter-spacing: -.04em;
}

.tx-catalog-intro > p:last-child {
    max-width: 720px;
    margin: 14px 0 0;
    color: var(--tx-muted);
    font-size: 15px;
    line-height: 1.8;
}

.bstem .tx-catalog-intro {
    border-color: rgba(255, 255, 255, .12);
    background:
        linear-gradient(120deg, rgba(255, 92, 92, .16), transparent 45%),
        linear-gradient(135deg, #171d2a, #101521);
}

.bstem .tx-catalog-intro h1 {
    color: var(--tx-cream);
}

.foot-logo-region .tx-brand-lockup {
    height: 58px;
}

@media screen and (max-width: 820px) {
    .container {
        width: 100%;
    }

    .tx-brand-lockup {
        gap: 7px;
        height: 44px;
    }

    .tx-brand-lockup .tx-brand-mark {
        width: 35px !important;
        height: 35px !important;
    }

    .tx-brand-wordmark strong {
        font-size: 17px;
    }

    .tx-brand-wordmark small {
        display: none;
    }

    .tx-catalog-intro {
        margin: 12px 10px 14px;
        padding: 20px;
        border-radius: 20px;
    }

    .tx-catalog-intro > p:last-child {
        font-size: 13px;
        line-height: 1.65;
    }

    .home-unified .box,
    .pannel,
    .mac-catalog-show__panel,
    .detail_list {
        border-right: 0;
        border-left: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .detail_list_box {
        padding-top: 70px;
    }

    .vodlist_thumb,
    .topiclist_thumb {
        border-radius: 13px;
    }

    #play_page .player_video,
    #play_page .play_but {
        border-radius: 0;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .vodlist_thumb,
    .topiclist_thumb {
        transition: none !important;
    }
}
