:root {
    --hhgys-ink: #202124;
    --hhgys-muted: #70757a;
    --hhgys-line: #e5e7eb;
    --hhgys-line-strong: #dadce0;
    --hhgys-green: #18864b;
    --hhgys-green-dark: #126b3b;
    --hhgys-green-soft: #e7f4ec;
    --hhgys-surface: #ffffff;
    --hhgys-surface-soft: #f8f9fa;
    --hhgys-shadow: 0 2px 8px rgba(60, 64, 67, .16);
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body.hhgys-page,
body:has(#app[data-hhgys-theme="1"]) {
    min-width: 320px;
    min-height: 100vh;
    margin: 0;
    overflow-x: hidden;
    color: var(--hhgys-ink);
    background: var(--hhgys-surface);
    font-family: Arial, "Microsoft YaHei", sans-serif;
    line-height: 1.5;
}

.hhgys-page a,
.hhgys-page button,
.hhgys-page input { -webkit-tap-highlight-color: transparent; }

.hhgys-page a { color: inherit; text-decoration: none; }
.hhgys-page button,
.hhgys-page input { font: inherit; }
.hhgys-page button { cursor: pointer; }

.hhgys-container {
    width: min(1100px, calc(100% - 40px));
    margin: 0 auto;
}

.hhgys-page [v-cloak] { display: none; }

/* The copied runtime styles are intentionally scoped here so the theme can coexist with
   the existing news/simple/mofa themes. */
.hhgys-page .common-header {
    position: relative;
    z-index: 10;
    height: 64px;
    border-bottom: 0;
    background: transparent;
}

.hhgys-page .common-header .headerBox,
.hhgys-page .common-header .headerBox .box {
    height: 64px;
    background: transparent;
}

.hhgys-page .headerBox {
    position: fixed !important;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99;
    height: 64px;
    background-color: #fff !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
    transition: background-color .2s ease, box-shadow .2s ease;
}

.hhgys-page .headerBox.is-scrolled {
    background-color: #fff !important;
    box-shadow: 0 6px 18px rgba(60, 64, 67, .18) !important;
}

.hhgys-page .common-header .headerBox .box {
    display: flex;
    width: min(1100px, calc(100% - 40px));
    margin: 0 auto;
    padding: 0;
    align-items: center;
    justify-content: space-between;
}

.hhgys-page .headerBox .bg {
    display: block;
    background: transparent;
    box-shadow: none;
}

.hhgys-page .common-header .logoBox.hhgys-brand {
    display: inline-flex;
    width: auto;
    height: auto;
    align-items: center;
    gap: 9px;
    color: #3c4043;
    background: transparent;
}

.hhgys-page .hhgys-brand .logo {
    width: 31px;
    height: 31px;
    border-radius: 50%;
    object-fit: cover;
}

.hhgys-page .hhgys-brand-symbol {
    display: grid;
    width: 31px;
    height: 31px;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: var(--hhgys-green);
    font-size: 15px;
    font-weight: 700;
}

.hhgys-page .common-header .headerBox .box .logoBox .title,
.hhgys-page .hhgys-brand .title {
    display: block;
    margin: 0;
    color: #3c4043;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.03em;
}

.hhgys-page .common-header .headerBox .box .logoBox .title::first-letter { color: #3c4043; }
.hhgys-page .common-header .headerBox .box .logoBox .title { color: var(--hhgys-green); }
.hhgys-page .hhgys-brand-muted { color: #3c4043; }
.hhgys-page .hhgys-brand-green { color: var(--hhgys-green); }

.hhgys-page .common-header .headerBox .box .navs {
    display: flex;
    height: auto;
    align-items: center;
    gap: 16px;
    color: #5f6368;
    font-size: 13px;
}

.hhgys-page .common-header .headerBox .box .hhgys-header-actions {
    position: relative;
    flex-shrink: 0;
}

.hhgys-page .common-header .headerBox .box .navs .item,
.hhgys-page .common-header .headerBox .box .navs .btns,
.hhgys-page .common-header .headerBox .box .navs .header-menu-btn {
    display: none;
}

.hhgys-page .common-header .headerBox .box .navs .hhgys-demand {
    display: inline-flex;
    align-items: center;
    padding: 8px 14px;
    border-radius: 999px;
    color: var(--hhgys-green-dark);
    background: var(--hhgys-green-soft);
    font-weight: 700;
    white-space: nowrap;
}

.hhgys-page .common-header .headerBox .box .navs .hhgys-short-url {
    color: var(--hhgys-muted);
    white-space: nowrap;
    text-decoration: none;
}

.hhgys-page .common-header .headerBox .box .navs .hhgys-film-link {
    color: var(--hhgys-green-dark);
    font-weight: 600;
    white-space: nowrap;
}

.hhgys-page .common-header .headerBox .box .navs .hhgys-film-link:hover,
.hhgys-page .common-header .headerBox .box .navs .hhgys-film-link:focus-visible,
.hhgys-page .common-header .headerBox .box .navs .hhgys-short-url:hover {
    color: var(--hhgys-green);
    text-decoration: underline;
    text-underline-offset: 3px;
}

.hhgys-about {
    color: #5f6368;
}

.hhgys-about:hover,
.hhgys-about:focus-visible { color: var(--hhgys-green-dark); text-decoration: underline; }

.hhgys-page .drawer .hhgys-about-menu,
.hhgys-page .drawer .hhgys-film-menu {
    color: var(--hhgys-ink);
    text-decoration: none;
}

.hhgys-page .common-header .headerBox .box .navs .header-menu-btn {
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 999px;
    color: var(--hhgys-green-dark);
    background: var(--hhgys-green-soft);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
}

.hhgys-page .headerKox { display: none; }

.hhgys-page .footerBox {
    margin-top: 20px;
    border-top: 1px solid var(--hhgys-line);
    background: var(--hhgys-surface-soft);
}

.hhgys-page .footerBox .box {
    width: min(1100px, calc(100% - 40px));
    margin: 0 auto;
    padding: 14px 0 18px;
    color: var(--hhgys-muted);
    font-size: 12px;
    text-align: center;
}

.hhgys-page .footerBox p { margin: 2px 0; }
.hhgys-page .footerBox a { color: var(--hhgys-green-dark); }
.hhgys-page .footerBox .hhgys-footer-intro {
    color: var(--hhgys-green-dark);
    font-weight: 600;
}
.hhgys-page .footerBox .hhgys-footer-disclaimer {
    max-width: 900px;
    margin: 3px auto 7px;
    color: var(--hhgys-muted);
    line-height: 1.7;
}
.hhgys-page .footerBox .hhgys-footer-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: 2px 0 0;
}
.hhgys-page .footerBox .hhgys-copyright { color: var(--hhgys-green-dark); }
.hhgys-page .footerBox .hhgys-config-copyright { color: inherit; }

.hhgys-page .global-backtop {
    border: 1px solid var(--hhgys-line);
    color: var(--hhgys-green);
    background: #fff;
    box-shadow: var(--hhgys-shadow);
}

.hhgys-page .el-dialog__header,
.hhgys-page .el-dialog__body,
.hhgys-page .el-dialog__footer { font-family: Arial, "Microsoft YaHei", sans-serif; }

.hhgys-page .resource-dialog-btn.btn-open,
.hhgys-page .resource-get-btn,
.hhgys-page .vbtn { background: var(--hhgys-green); }

.hhgys-page .resource-dialog-btn.btn-open,
.hhgys-page .resource-dialog-btn.btn-open:hover,
.hhgys-page .resource-dialog-btn.btn-open:focus-visible { color: #fff; }

.hhgys-page .dialogUrlBox .resource-dialog-shell.no-poster .resource-dialog-info { margin-top: 12px; }

.hhgys-page .dialogUrlBox .el-dialog__headerbtn {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    line-height: 1;
}

.hhgys-page .dialogUrlBox .el-dialog__headerbtn .el-dialog__close {
    display: block;
    margin: 0;
    line-height: 1;
}

.hhgys-page .resource-dialog-btn.btn-open:hover,
.hhgys-page .resource-get-btn:hover,
.hhgys-page .vbtn:hover { background: var(--hhgys-green-dark); }

@media (max-width: 768px) {
    .hhgys-page .common-header .headerBox .box .navs .hhgys-about,
    .hhgys-page .common-header .headerBox .box .navs .header-menu-btn { display: none !important; }
}

@media (max-width: 700px) {
    .hhgys-container { width: min(100% - 28px, 1100px); }
    .hhgys-page .common-header .headerBox .box,
    .hhgys-page .footerBox .box {
        width: calc(100% - 28px) !important;
    }
    .hhgys-page .common-header .headerBox .box .navs {
        max-width: calc(100% - 74px);
        flex-wrap: wrap;
        justify-content: flex-end;
        gap: 6px 9px;
    }
    .hhgys-page .common-header .headerBox .box .hhgys-header-actions {
        gap: 8px;
    }
    .hhgys-page .common-header .headerBox .box .navs .hhgys-about { display: none !important; }
    .hhgys-page .common-header .headerBox .box .navs .hhgys-demand,
    .hhgys-page .common-header .headerBox .box .navs .hhgys-film-link { display: none !important; }
    .hhgys-page .common-header .headerBox .box .navs .hhgys-short-url,
    .hhgys-page .common-header .headerBox .box .navs .hhgys-film-link {
        font-size: 11px;
    }
    .hhgys-page .common-header .headerBox .box .navs .header-menu-btn {
        display: inline-flex !important;
    }
}

@media (max-width: 420px) {
    .hhgys-page .common-header,
    .hhgys-page .common-header .headerBox {
        height: auto !important;
        min-height: 58px;
    }
    .hhgys-page .common-header .headerBox { position: fixed !important; }
    .hhgys-page .common-header .headerBox .box {
        height: auto !important;
        min-height: 58px;
        padding: 8px 14px !important;
        align-items: center !important;
        overflow: visible !important;
    }
    .hhgys-page .hhgys-brand .logo,
    .hhgys-page .hhgys-brand-symbol { width: 29px; height: 29px; }
    .hhgys-page .common-header .headerBox .box .logoBox .title {
        width: auto;
        flex-shrink: 0;
        font-size: 16px;
        line-height: 29px !important;
        white-space: nowrap;
    }
    .hhgys-page .common-header .headerBox .box .navs {
        max-width: calc(100% - 68px);
        align-items: center;
        gap: 4px 7px;
    }
    .hhgys-page .common-header .headerBox .box .navs .hhgys-demand {
        padding: 5px 8px;
        font-size: 10px;
    }
    .hhgys-page .common-header .headerBox .box .navs .hhgys-short-url,
    .hhgys-page .common-header .headerBox .box .navs .hhgys-film-link {
        font-size: 10px;
    }
    .hhgys-page .footerBox .box { padding: 10px 0 14px !important; }
    .hhgys-page .footerBox .hhgys-footer-meta { gap: 2px 8px; }
}
