/* AUTO-GENERATED by scripts/build-shell-css.sh — do not edit by hand */
/* sources: base.css + header.css + footer.css + eightPop.css */

/* ===== base.css ===== */
/* Basic reset: keep layout deterministic */
html,
body {
  margin: 0;
  padding: 0;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  background: #0A0A0A;
  font-family: PingFang SC, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 100%;
}

img {
  display: block;
}

/* 去掉浏览器默认输入框 focus 光圈 / outline；组件可自行保留边框高亮 */
input,
textarea,
select {
  outline: none;
  outline-color: transparent;
  -webkit-tap-highlight-color: transparent;
}

input:focus,
input:focus-visible,
textarea:focus,
textarea:focus-visible,
select:focus,
select:focus-visible {
  outline: none;
  outline-color: transparent;
}

input[type="search"] {
  -webkit-appearance: none;
  appearance: none;
}

input[type="search"]::-webkit-search-decoration,
input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-results-button,
input[type="search"]::-webkit-search-results-decoration {
  -webkit-appearance: none;
}

html {
  scrollbar-width: thin;
  scrollbar-color: #3A3A3A #0A0A0A;
}

::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: #0A0A0A;
}

::-webkit-scrollbar-thumb {
  background: #3A3A3A;
  border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
  background: #4A4A4A;
}

/* 语义标题：避免浏览器默认 h1–h3 margin 影响现有布局 */
h1,
h2,
h3 {
  margin: 0;
  font-size: inherit;
  font-weight: inherit;
}

/* 仅供爬虫/读屏的语义内容，不影响视觉布局 */
.seo-visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* One PC breadcrumb size across both shared and legacy page templates. */
@media (min-width: 768px) {
  html body nav[aria-label="面包屑"][class],
  html body nav[aria-label="面包屑"][class] :is(a, span) {
    font-size: 14px;
    line-height: 20px;
  }
}


/* ===== header.css ===== */
.site-header {
    position: sticky;
    top: 0;
    align-self: stretch;
    width: 100%;
    height: 72px;
    background: #181818;
    overflow: hidden;
    justify-content: center;
    align-items: center;
    display: flex;
    z-index: 100;
    box-sizing: border-box;
}

.header-inner {
    width: 1554px;
    min-width: 0;
    max-width: calc(100% - 32px);
    height: 72px;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    display: flex;
    box-sizing: border-box;
}

.brand-lockup {
    justify-content: flex-start;
    align-items: center;
    display: flex;
    text-decoration: none;
    flex-shrink: 0;
}

.brand-logo {
    width: 133px;
    height: auto;
    display: block;
}

.brand-title {
    color: white;
    font-size: 18px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 24px;
    word-wrap: break-word;
}

.brand-subtitle-en {
    color: #A69CB8;
    font-size: 12px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 18px;
    word-wrap: break-word;
}

.header-nav {
    overflow: hidden;
    justify-content: flex-start;
    align-items: center;
    gap: 60px;
    display: flex;
    flex-shrink: 0;
}

.nav-link-active {
    color: #FADC44;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 20px;
    word-wrap: break-word;
    text-decoration: none;
}

.nav-link {
    color: #F5F5F5;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 20px;
    word-wrap: break-word;
    text-decoration: none;
}

.nav-link:hover {
    color: #FADC44;
}

.header-gap {
    width: 24px;
    height: 9px;
    position: relative;
    flex-shrink: 0;
}

.header-search {
    flex: 1 1 0;
    min-width: 160px;
    max-width: 462px;
    height: 40px;
    padding-left: 14px;
    padding-right: 14px;
    background: rgba(255, 255, 255, 0.05);
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid rgba(255, 255, 255, 0.10);
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    display: flex;
    margin-left: auto;
}

.search-icon-wrap {
    width: 15px;
    height: 15px;
    position: relative;
    overflow: hidden;
    display: block;
    object-fit: contain;
}

.search-icon-wrap--h5 {
    display: none;
}

.search-input {
    flex: 1 1 0;
    min-width: 0;
    height: 100%;
    border: none;
    background: transparent;
    box-shadow: none;
    outline: none;
    outline-color: transparent;
    -webkit-appearance: none;
    appearance: none;
    color: #F5F5F5;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 20px;
}

.search-input:focus,
.search-input:focus-visible {
    border: none;
    outline: none;
    outline-color: transparent;
    box-shadow: none;
}

.search-input::placeholder {
    color: #A3A3A3;
}

.header-app-icon {
    width: auto;
    height: 31px;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
    text-decoration: none;
}

.header-app-icon img {
    width: auto;
    height: 31px;
    display: block;
}

/*.header-app-icon[hidden],
.header-separator[hidden] {
    display: none !important;
}*/

.header-separator {
    width: 1px;
    height: 12px;
    background: white;
}

.header-account {
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    display: flex;
    text-decoration: none;
    color: inherit;
}

.account-avatar {
    width: 40px;
    height: 40px;
    position: relative;
    overflow: hidden;
    border-radius: 1249px;
    background: rgba(255, 255, 255, 0.05);
}

.account-avatar-ring {
    width: 40px;
    height: 40px;
    left: 0px;
    top: 0px;
    position: absolute;
    object-fit: cover;
    display: none;
    border-radius: 9999px;
}

.account-avatar-body {
    width: 20px;
    height: 9px;
    left: 10px;
    top: 21px;
    position: absolute;
    background: #FADC44;
    border-radius: 9999px;
}

.account-avatar-head {
    width: 10px;
    height: 11px;
    left: 15px;
    top: 9px;
    position: absolute;
    background: #FADC44;
    border-radius: 7.50px 1.25px 7.50px 7.50px;
}

.account-avatar-photo {
    width: 40px;
    height: 40px;
    border-radius: 999px;
    object-fit: cover;
    display: block;
    flex-shrink: 0;
}

.account-label {
    justify-content: center;
    display: flex;
    flex-direction: column;
    color: #FADC44;
    font-size: 14px;
    font-family: PingFang SC;
    font-weight: 400;
    line-height: 20px;
    word-wrap: break-word;
}

.account-label--logged {
    color: white;
}

@media (max-width: 767px) {
    .site-header {
        height: 48px;
        background: #181818;
        justify-content: center;
        align-items: center;
        gap: 0;
        padding: 0 16px;
        overflow: hidden;
    }

    .header-inner {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        height: 48px;
        justify-content: flex-start;
        align-items: center;
        gap: 12px;
    }

    .brand-lockup {
        position: static;
        left: auto;
        transform: none;
        flex-shrink: 0;
    }

    .brand-logo {
        width: auto;
        height: 32px;
        max-width: 110px;
        object-fit: contain;
        object-position: left center;
    }

    .header-nav,
    .header-gap,
    .header-app-icon,
    .header-separator,
    .header-account {
        display: none;
    }

    .header-search {
        display: flex;
        flex: 1 1 0;
        min-width: 0;
        height: auto;
        padding: 6px 16px;
        border-radius: 999px;
        gap: 8px;
    }

    .search-icon-wrap--pc {
        display: none;
    }

    .search-icon-wrap--h5 {
        display: block;
        order: 2;
        width: 16px;
        height: 16px;
        flex-shrink: 0;
    }

    .search-input {
        order: 1;
        font-size: 12px;
        line-height: 18px;
        height: auto;
        color: white;
    }

    .search-input::placeholder {
        color: rgba(255, 255, 255, 0.60);
    }
}


/* ===== footer.css ===== */
.footer-box { width:100%; background:#282828; color:rgba(255,255,255,.55); box-sizing:border-box; }
.footer-outer { width:1520px; max-width:calc(100% - 64px); margin:0 auto; padding:36px 0; display:flex; flex-direction:column; gap:12px; box-sizing:border-box; }
.footer-main { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:18px 32px; align-items:end; }
.footer-brand { display:flex; align-items:center; gap:16px; min-width:0; grid-column:1/-1; }
.footer-brand-lockup { display:block; flex-shrink:0; text-decoration:none; }
.footer-logo { width:180px; height:auto; display:block; }
.footer-tagline { margin:0; font-size:18px; line-height:24px; }
.footer-addresses { display:flex; flex-direction:column; gap:4px; min-width:0; font-size:16px; line-height:22px; overflow-wrap:anywhere; }
.footer-box a { color:inherit; text-decoration:none; }
.footer-box a:hover { color:#ff4b02; }
.footer-box :is(a,button):focus-visible { outline:2px solid #ff4b02; outline-offset:4px; }
.footer-links { display:flex; align-items:center; justify-content:flex-end; flex-wrap:wrap; gap:12px 0; font-size:16px; line-height:22px; color:rgba(255,255,255,.8); }
.footer-links a { display:block; padding:0 15px; white-space:nowrap; border-right:1px solid rgba(255,255,255,.2); }
.footer-links a:first-child { padding-left:0; }
.footer-links a:last-child { padding-right:0; border-right:0; }
.footer-bottom { display:flex; align-items:center; justify-content:space-between; gap:18px; padding-top:12px; border-top:1px solid rgba(255,255,255,.05); }
.footer-copy { font-size:14px; line-height:20px; }
.footer-actions,.footer-icons { display:flex; align-items:center; gap:16px; }
.footer-icon-link { width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.1); display:flex; justify-content:center; align-items:center; flex-shrink:0; }
.footer-icon-link:hover { background:rgba(255,255,255,.18); }
.footer-icon-outer { display:block; object-fit:contain; width:20px; height:20px; }
.footer-cooperation-icon { width:24px; height:24px; }
.footer-mobile-legal,.h5-tabbar { display:none; }
@media(max-width:767px) {
 .footer-outer { width:100%; max-width:100%; padding:28px 16px; gap:18px; }
 .footer-main { grid-template-columns:minmax(0,1fr); gap:18px; }
 .footer-brand { flex-wrap:wrap; gap:12px; }
 .footer-tagline { font-size:16px; line-height:24px; }
 .footer-addresses { font-size:14px; line-height:22px; }
 .footer-links { justify-content:flex-start; font-size:14px; line-height:22px; }
 .footer-links a { padding:0 12px; }
 .footer-bottom { flex-direction:column; align-items:flex-start; gap:16px; }
 .footer-icons { flex-wrap:wrap; }
}

@media (min-width: 768px) {
 .footer-logo { width:150px; }
 .footer-tagline { font-size:14px; line-height:20px; }
 .footer-addresses,.footer-links { font-size:14px; line-height:20px; }
 .footer-copy { font-size:12px; line-height:18px; }
}


/* ===== eightPop.css ===== */
/* Shared entry dialogs: Figma 40001:93528 and 40071:449452. */
.eight-pop-mask{position:fixed;inset:0;z-index:2000;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.76);padding:16px;box-sizing:border-box}
.eight-pop-mask.is-open{display:flex}
.eight-pop-mask[hidden],.entry-dialog[hidden]{display:none!important}
.entry-dialog{display:flex;flex-direction:column;align-items:center;gap:24px;width:440px;max-width:100%;max-height:calc(100vh - 32px);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
.entry-dialog:focus{outline:none}
.eight-pop-card{flex-shrink:0;display:flex;flex-direction:column;align-items:center;width:100%;padding:36px;gap:36px;box-sizing:border-box;border:1px solid rgba(255,255,255,.2);border-radius:40px;background:#0d0d0d;color:rgba(255,255,255,.9)}
.eight-pop-icon{display:block;width:78px;height:78px;flex-shrink:0}
.eight-pop-copy{display:flex;flex-direction:column;gap:24px;width:100%}
.eight-pop-title{margin:0;text-align:center;font-size:24px;line-height:32px;font-weight:500}
.eight-pop-desc{margin:0;text-align:justify;font-size:18px;line-height:24px;font-weight:400;overflow-wrap:anywhere}
.eight-pop-actions{display:flex;flex-direction:column;gap:18px;width:100%}
.eight-pop-btn{width:100%;min-height:46px;padding:12px 16px;border:0;border-radius:12px;font-family:inherit;font-size:16px;line-height:22px;font-weight:600;color:#fff;cursor:pointer}
.eight-pop-btn--confirm{background:#ff4b02}
.eight-pop-btn--exit{background:#1a1a1a}
.entry-dialog-close{display:flex;align-items:center;justify-content:center;flex:0 0 36px;width:36px;height:36px;border:0;background:transparent;padding:0;cursor:pointer}
.entry-dialog-close img{display:block;width:36px;height:36px}
.entry-dialog :is(button,a):focus-visible{outline:2px solid #ff4b02;outline-offset:3px}
.entry-ad-dialog{width:min(400px,calc((100vh - 108px)*.66445));width:min(400px,calc((100dvh - 108px)*.66445));overflow:visible}
.entry-ad-art{display:block;flex-shrink:0;width:100%;aspect-ratio:400/602;border-radius:40px;overflow:hidden;background:#0d0d0d}
.entry-ad-art img{display:block;width:100%;height:100%;object-fit:contain}
@media(max-width:480px){
 .eight-pop-card{padding:28px 24px;gap:28px;border-radius:32px}
 .eight-pop-copy{gap:20px}
 .eight-pop-desc{font-size:16px;line-height:24px}
 .entry-ad-art{border-radius:32px}
}
@media(max-height:680px){
 .eight-pop-card{padding:20px 24px;gap:20px}
 .eight-pop-copy{gap:16px}
 .eight-pop-icon{width:64px;height:64px}
 .eight-pop-desc{font-size:16px;line-height:22px}
 .eight-pop-actions{gap:12px}
 .entry-dialog{gap:16px}
}