/* 特色数智：粒子云 + 右侧纵向文字。手机竖屏改为底部内容区，横屏仍保留左右布局。
   所有 svh 前保留 vh 回退；safe-area 不支持时保留上一条常规间距。 */
html.viewer_page .smart_features {
    --features-unit: 1vh; --features-axis: x; --features-enter: 0;
    position: fixed; top: 0; right: 0; bottom: 0; left: 0; inset: 0; z-index: 65; color: #EDF5FF; overflow: hidden;
    opacity: 0; visibility: hidden; pointer-events: none;
}
@supports (height: 1svh) { html.viewer_page .smart_features { --features-unit: 1vh; --features-unit: 1svh; } }
html.viewer_page .smart_features, html.viewer_page .smart_features * { box-sizing: border-box; }
html.viewer_page .smart_features.is-visible { visibility: visible; }
html.viewer_page .smart_features[inert] * { pointer-events: none !important; }
html.viewer_page .features_stage { position: absolute; top: 0; right: auto; bottom: auto; left: 0; inset: 0 auto auto 0; pointer-events: auto; touch-action: none; }
html.viewer_page .features_panel {
    position: absolute; top: 0; right: 0; bottom: 0; left: auto; inset: 0 0 0 auto; width: 34%; max-width: 38rem;
    padding: calc(var(--features-unit) * 12) 3vw calc(var(--features-unit) * 13) 5vw;
    background: linear-gradient(to left, #00000099 0%, #00000066 52%, #0000002E 77%, #00000000 100%);
    pointer-events: auto;
    /* 整个面板连同渐变背景从屏幕外滑入，进度与场景切换同步，不叠加第二段 CSS transition。 */
    transform: translate3d(calc((1 - var(--features-enter)) * 100%), 0, 0);
}
html.viewer_page .features_content {
    display: flex; flex-direction: column; gap: calc(var(--features-unit) * 2.5); height: 100%; min-height: 0;
}
html.viewer_page .features_heading { flex: none; margin: 0; padding-bottom: 1rem; border-bottom: .065rem solid #FFFFFF24; }
html.viewer_page .features_heading::before { content: ''; display: block; width: 2.4rem; height: .15rem; margin-bottom: 1rem; border-radius: 1rem; background: var(--theme-accent, #2273D7); }
html.viewer_page .features_heading h2 { margin: 0; font-size: calc(var(--features-unit) * 3.5);  line-height: 1.25; font-weight: 500; letter-spacing: .12em; }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_heading h2 { font-size: clamp(1.3rem, calc(var(--features-unit) * 3.5), 2.6rem); }
}

html.viewer_page .features_swiper {
    flex: 1; min-height: 0; width: 100%; margin: 0; outline: none; touch-action: pan-x; overscroll-behavior: contain;
    -webkit-mask-image: linear-gradient(to bottom, #00000000, #000000 12%, #000000 88%, #00000000);
    mask-image: linear-gradient(to bottom, #00000000, #000000 12%, #000000 88%, #00000000);
}
html.viewer_page .features_swiper:not(.swiper-grabbing) .features_slide { cursor: pointer; }
html.viewer_page .features_slide { height: 4rem;  display: flex; align-items: center; gap: .85rem; border-bottom: .065rem solid #FFFFFF14; }
@supports (width: max(1vh, 1vw)) {
    html.viewer_page .features_slide { height: max(4rem, calc(var(--features-unit) * 13)); }
}

html.viewer_page .features_number { flex: none; color: #6D7D90; font-size: .8rem; line-height: 1; font-variant-numeric: tabular-nums; transition: color 400ms ease; }
html.viewer_page .features_icon { flex: none; display: grid; place-items: center; width: 1.25em; font-family: 'XundaFeatureIcons' !important; font-size: calc(var(--features-unit) * 2.7);  font-style: normal; font-weight: normal; line-height: 1; color: #70839B; visibility: hidden; transition: color 400ms ease; -webkit-font-smoothing: antialiased; }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_icon { font-size: clamp(1.15rem, calc(var(--features-unit) * 2.7), 1.8rem); }
}

html.viewer_page .has-feature-icons .features_icon { visibility: visible; }
/* 与常规 iconfont 一样使用空节点 + 单个 ::before；局部映射也兼容页面尚未更新的 iconfont.css。 */
html.viewer_page .features_icon::before { content: none; font-family: inherit; }
html.viewer_page .features_icon.icon-xdicon1::before { content: "\e6ea"; }
html.viewer_page .features_icon.icon-xdicon2::before { content: "\e673"; }
html.viewer_page .features_icon.icon-xdicon3::before { content: "\e606"; }
html.viewer_page .features_icon.icon-xdicon4::before { content: "\e60c"; }
html.viewer_page .features_icon.icon-xdicon5::before { content: "\e68a"; }
html.viewer_page .features_icon.icon-xdicon6::before { content: "\e60b"; }
html.viewer_page .features_icon.icon-xdicon7::before { content: "\e60a"; }
html.viewer_page .features_icon.icon-xdicon8::before { content: "\e654"; }
html.viewer_page .features_icon.icon-xdicon9::before { content: "\ecdb"; }
html.viewer_page .features_icon.icon-xdicon10::before { content: "\e603"; }
html.viewer_page .features_icon.icon-xdicon11::before { content: "\e6f6"; }
html.viewer_page .features_slide.swiper-slide-active .features_icon { color: var(--theme-accent, #2273D7); }
html.viewer_page .features_name { margin: 0; color: #7E8A9A; font-size: calc(var(--features-unit) * 3.3);  font-weight: 400; letter-spacing: .08em; line-height: 1.4; transition: color 400ms ease, transform 550ms ease; }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_name { font-size: clamp(1.2rem, calc(var(--features-unit) * 3.3), 2.8rem); }
}

html.viewer_page .features_slide.swiper-slide-active .features_name { color: #F4F8FF; transform: translateX(.3rem); }
html.viewer_page .features_slide.swiper-slide-active .features_number { color: var(--theme-accent, #2273D7); }
html.viewer_page .features_meta { flex: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; color: #758397; font-size: .75rem; letter-spacing: .1em; }
html.viewer_page .features_count { font-variant-numeric: tabular-nums; }
html.viewer_page .features_count b { color: #DFEAF8; font-weight: 500; }
html.viewer_page .features_empty { margin: auto 0; color: #8493A6; font-size: .9rem; }
html.viewer_page .features_swiper:not(.swiper-initialized) { overflow-y: auto; touch-action: pan-y; }
html.viewer_page .features_swiper:not(.swiper-initialized) .swiper-wrapper { display: block; height: auto; }
html.viewer_page .features_swiper:not(.swiper-initialized) .features_name { color: #DFEAF8; }
@media (hover: hover) and (pointer: fine) { html.viewer_page .features_slide:hover .features_name { color: #B8D9FF; } }
@media (max-width: 75em) and (max-aspect-ratio: 1/1) {
    html.viewer_page .smart_features { --features-axis: y; }
    html.viewer_page .features_panel {
        top: auto; right: 0; bottom: 0; left: 0; inset: auto 0 0; width: 100%; max-width: none; height: calc(var(--features-unit) * 48);
        padding: calc(var(--features-unit) * 3) 1.5rem calc(var(--features-unit) * 12);
        padding-bottom: calc(var(--features-unit) * 12 + env(safe-area-inset-bottom, 0rem));
        background: linear-gradient(to top, #000000A6 0%, #00000073 66%, #00000033 86%, #00000000 100%);
    }
    html.viewer_page .features_content { gap: .55rem; }
    html.viewer_page .features_heading { padding-bottom: .65rem; }
    html.viewer_page .features_heading::before { display: none; }
    html.viewer_page .features_heading h2 { font-size: calc(var(--features-unit) * 2.6);  }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_heading h2 { font-size: clamp(1.15rem, calc(var(--features-unit) * 2.6), 1.6rem); }
}

    html.viewer_page .features_slide { height: 3.35rem;  gap: .75rem; }
@supports (width: max(1vh, 1vw)) {
    html.viewer_page .features_slide { height: max(3.35rem, calc(var(--features-unit) * 7.5)); }
}

    html.viewer_page .features_name { font-size: calc(var(--features-unit) * 2.8);  }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_name { font-size: clamp(1.15rem, calc(var(--features-unit) * 2.8), 1.8rem); }
}

    html.viewer_page .features_meta { font-size: .68rem; }
}
@media (max-height: 30em) and (orientation: landscape) {
    html.viewer_page .features_panel { padding: calc(var(--features-unit) * 8) 1.25rem calc(var(--features-unit) * 23) 5vw;  }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_panel { padding: calc(var(--features-unit) * 8) 1.25rem calc(var(--features-unit) * 23) clamp(1.25rem, 5vw, 3rem); }
}

    html.viewer_page .features_content { gap: .6rem; }
    html.viewer_page .features_heading { padding-bottom: .5rem; }
    html.viewer_page .features_heading::before { display: none; }
    html.viewer_page .features_heading h2 { font-size: 1.05rem; }
    html.viewer_page .features_name { font-size: calc(var(--features-unit) * 5);  }
@supports (width: clamp(1vh, 2vh, 3vh)) {
    html.viewer_page .features_name { font-size: clamp(.9rem, calc(var(--features-unit) * 5), 1.3rem); }
}

    html.viewer_page .features_slide { height: 2.7rem;  gap: .7rem; }
@supports (width: max(1vh, 1vw)) {
    html.viewer_page .features_slide { height: max(2.7rem, calc(var(--features-unit) * 17)); }
}

    html.viewer_page .features_meta { font-size: .65rem; }
}
/* 手机横屏保留两栏，但与竖屏一样从屏幕下方进入。 */
@media (max-width: 62.25em), (max-width: 75em) and (pointer: coarse) {
    html.viewer_page .features_panel { transform: translate3d(0, calc((1 - var(--features-enter)) * 100%), 0); }
}
@media (max-width: 62.25em) and (max-height: 30em) and (orientation: landscape) {
    html.viewer_page .features_panel { width: 48%; max-width: none; }
}
@media (prefers-reduced-motion: reduce) {
    html.viewer_page .features_panel { transform: none; }
    html.viewer_page .features_name, html.viewer_page .features_number, html.viewer_page .features_icon { transition: none; }
}