/* F3 video-portal family stylesheet — dark cinema system.
   Palette: #14181f ground, raised #1d232e panels, amber accent. */
:root {
    --vd-bg:rgb(20,24,31);
    --vd-bg-soft:#191e27;
    --vd-panel:#1d232e;
    --vd-panel-2:rgb(35,43,56);
    --vd-line:rgb(46,55,69);
    --vd-line-soft:#262e3b;
    --vd-ink:#e8ecf1;
    --vd-body:rgb(195,204,214);
    --vd-mute:rgb(139,152,168);
    --vd-accent:rgb(242,163,60);
    --vd-accent-soft:#FFCF87;
    --vd-red:#e5534b;
    --vd-maxw:1180px;
    --vd-sans:system-ui,-apple-system,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;
}
* {
    box-sizing:border-box;
}
html {
    -webkit-text-size-adjust:100%;
}
body {
    margin:0;
    background:var(--vd-bg);
    color:var(--vd-body);
    font-family:var(--vd-sans);
    font-size:15.5px;
    line-height:1.75;
}
a {
    color:var(--vd-accent-soft);
    text-decoration:none;
}
a:hover {
    color:var(--vd-accent);
    text-decoration:underline;
}
a:focus-visible {
    outline:2px solid var(--vd-accent);
    outline-offset:2px;
}
::selection {
    background:#5a3d14;
    color:#ffe9c4;
}
.vd-wrap {
    max-width:var(--vd-maxw);
    margin:0 auto;
    padding:0 14px;
}
main {
    display:block;
    max-width:var(--vd-maxw);
    margin:0 auto;
    padding:16px 14px 10px;
}
main h1 {
    font-size:26px;
    line-height:1.4;
    margin:0 0 10px;
    color:var(--vd-ink);
}
main h2 {
    font-size:20px;
    line-height:1.45;
    margin:0 0 10px;
    color:var(--vd-ink);
}
main h3 {
    font-size:16.5px;
    line-height:1.5;
    margin:0 0 5px;
}
main p {
    margin:0 0 .95em;
}
main ul, main ol {
    margin:.2em 0 1em;
    padding-left:1.35em;
}
main li {
    margin:.24em 0;
}
main strong {
    color:var(--vd-accent-soft);
}
main img {
    max-width:100%;
    height:auto;
}
.vd-topbar {
    background:rgb(13,16,21);
    color:#93A1B3;
    font-size:12.5px;
    border-bottom:1px solid var(--vd-line-soft);
}
.vd-topbar .vd-wrap {
    display:flex;
    justify-content:space-between;
    gap:12px;
    padding-top:5px;
    padding-bottom:5px;
    flex-wrap:wrap;
}
.vd-topbar a {
    color:#c8d2de;
}
.vd-topbar .vd-tb-name {
    color:var(--vd-ink);
    font-weight:700;
}
.vd-mast {
    background:linear-gradient(180deg,#1a2029 0%,var(--vd-bg-soft) 100%);
    border-bottom:1px solid var(--vd-line);
}
.vd-mastrow {
    display:flex;
    align-items:center;
    gap:16px;
    padding:18px 0 8px;
    flex-wrap:wrap;
}
.vd-mark {
    flex:none;
    width:52px;
    height:52px;
    border-radius:12px;
    background:var(--vd-accent);
    color:#191204;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:24px;
    font-weight:900;
    line-height:1;
}
.vd-sitename {
    font-size:29px;
    font-weight:800;
    line-height:1.25;
    margin:0;
    color:var(--vd-ink);
}
.vd-tagline {
    font-size:13.5px;
    color:var(--vd-mute);
    margin:2px 0 0;
}
.vd-maststats {
    margin-left:auto;
    text-align:right;
    font-size:12.5px;
    color:var(--vd-mute);
    line-height:1.8;
}
.vd-maststats b {
    color:var(--vd-accent-soft);
    font-size:15px;
}
.vd-channav {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    padding:8px 0 14px;
}
.vd-channav a {
    font-size:14px;
    font-weight:600;
    color:var(--vd-body);
    background:var(--vd-panel);
    border:1px solid var(--vd-line);
    border-radius:999px;
    padding:3px 14px;
}
.vd-channav a:hover {
    border-color:var(--vd-accent);
    color:var(--vd-accent-soft);
    text-decoration:none;
}
.vd-channav a.vd-on {
    background:var(--vd-accent);
    color:#191204;
    border-color:var(--vd-accent);
}
.vd-crumbs {
    font-size:13px;
    color:var(--vd-mute);
    margin:0 0 12px;
}
.vd-crumbs ol {
    list-style:none;
    display:flex;
    flex-wrap:wrap;
    gap:2px 5px;
    padding:0;
    margin:0;
}
.vd-crumbs li {
    margin:0;
}
.vd-crumbs li+li::before {
    content:"›";
    margin-right:5px;
    color:var(--vd-mute);
}
.vd-crumbs a {
    color:var(--vd-mute);
    text-decoration:underline;
}
.vd-sechead {
    display:flex;
    align-items:baseline;
    gap:10px;
    margin:22px 0 12px;
}
.vd-sechead h2 {
    margin:0;
    font-size:20px;
}
.vd-sechead .vd-kick {
    font-size:11px;
    letter-spacing:.16em;
    color:var(--vd-accent);
    font-weight:800;
}
.vd-sechead .vd-more {
    margin-left:auto;
    white-space:nowrap;
    font-size:13.5px;
}
.vd-basis {
    font-size:12.5px;
    color:var(--vd-mute);
    margin:-4px 0 12px;
}
.vd-card {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
}
.vd-card:hover {
    border-color:var(--vd-accent);
}
.vd-card .vd-thumb {
    display:block;
    position:relative;
    line-height:0;
}
.vd-card .vd-thumb img {
    object-fit:cover;
    aspect-ratio:16/9;
    width:100%;
}
.vd-badge {
    position:absolute;
    left:8px;
    top:8px;
    background:rgba(10,12,16,.82);
    color:var(--vd-accent-soft);
    font-size:11px;
    font-weight:700;
    line-height:1.7;
    padding:0 8px;
    border-radius:4px;
    letter-spacing:.06em;
}
.vd-cardbody {
    padding:10px 12px 12px;
    display:flex;
    flex-direction:column;
    gap:4px;
}
.vd-cardbody h3 {
    font-size:15.5px;
    line-height:1.5;
    margin:0;
}
.vd-cardbody h3 a {
    color:var(--vd-ink);
}
.vd-kandian {
    font-size:13px;
    color:var(--vd-mute);
    line-height:1.6;
    margin:0;
}
.vd-cardmeta {
    display:flex;
    gap:8px;
    align-items:center;
    font-size:12px;
    color:var(--vd-mute);
    margin-top:2px;
    flex-wrap:wrap;
}
.vd-chip {
    display:inline-block;
    font-size:11.5px;
    color:var(--vd-accent-soft);
    background:#2A2113;
    border:1px solid #4a3a1c;
    padding:0 7px;
    line-height:1.8;
    border-radius:4px;
}
.vd-chip:hover {
    color:var(--vd-accent);
    text-decoration:none;
}
.vd-focus {
    display:grid;
    grid-template-columns:1.9fr 1fr;
    gap:14px;
    margin:4px 0 6px;
}
.vd-focus .vd-card .vd-cardbody h3 {
    font-size:21px;
}
.vd-focus .vd-kandian {
    font-size:14px;
}
.vd-focus-side {
    display:grid;
    grid-template-rows:1fr 1fr;
    gap:14px;
}
.vd-layout {
    display:grid;
    grid-template-columns:1fr 308px;
    gap:20px;
    align-items:start;
}
.vd-row {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}
.vd-row3 {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
}
.vd-relmesh {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:12px;
}
.vd-relmesh>li {
    margin:0;
    display:flex;
}
.vd-relmesh .vd-card {
    flex:1;
}
@media (max-width: 1020px) {
    .vd-relmesh {
        grid-template-columns:repeat(2,1fr);
    }
}
@media (max-width: 680px) {
    .vd-relmesh {
        grid-template-columns:1fr;
    }
}
.vd-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:14px;
}
.vd-rail {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    padding:13px 15px 8px;
    margin:0 0 16px;
}
.vd-rail h2 {
    font-size:17px;
    margin:0 0 4px;
}
.vd-ranklist {
    list-style:none;
    margin:6px 0 4px;
    padding:0;
    counter-reset:rk;
}
.vd-ranklist li {
    display:flex;
    gap:10px;
    padding:7px 0;
    align-items:baseline;
    border-bottom:1px solid var(--vd-line-soft);
}
.vd-ranklist li:last-child {
    border-bottom:none;
}
.vd-rk {
    flex:none;
    width:22px;
    height:22px;
    border-radius:6px;
    text-align:center;
    font-size:13px;
    font-weight:800;
    line-height:22px;
    background:var(--vd-panel-2);
    color:var(--vd-mute);
}
.vd-ranklist li:nth-child(-n+3) .vd-rk {
    background:var(--vd-accent);
    color:#191204;
}
.vd-ranklist .vd-rt {
    font-size:14.5px;
    line-height:1.5;
}
.vd-ranklist .vd-rt a {
    color:var(--vd-ink);
}
.vd-ranklist .vd-rs {
    margin-left:auto;
    font-size:12px;
    white-space:nowrap;
    color:var(--vd-mute);
}
.vd-albumgrid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:12px;
}
.vd-albumindex {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:6px 22px;
}
.vd-albumindex li {
    display:flex;
    justify-content:space-between;
    gap:10px;
    border-bottom:1px dashed var(--vd-line-soft);
    padding:5px 0;
}
.vd-albumindex span {
    white-space:nowrap;
    font-size:12.5px;
    color:var(--vd-dim);
}
.vd-albumcard {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    overflow:hidden;
}
.vd-albumcard img {
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
    display:block;
}
.vd-albumcard .vd-cardbody h3 a {
    color:var(--vd-ink);
}
.vd-tagwall {
    line-height:2.1;
    margin:0;
}
.vd-tagwall a {
    display:inline-block;
    font-size:13px;
    color:var(--vd-body);
    background:var(--vd-panel);
    border:1px solid var(--vd-line);
    padding:0 10px;
    border-radius:999px;
    margin:0 5px 6px 0;
}
.vd-tagwall a:hover {
    border-color:var(--vd-accent);
    color:var(--vd-accent-soft);
    text-decoration:none;
}
.vd-posterhead {
    margin:0 0 14px;
}
.vd-posterframe {
    position:relative;
    border-radius:12px;
    overflow:hidden;
    border:1px solid var(--vd-line);
    line-height:0;
}
.vd-posterframe img {
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
}
.vd-posterframe .vd-badge {
    font-size:12.5px;
    top:12px;
    left:12px;
    padding:1px 10px;
}
.vd-posternote {
    font-size:13px;
    color:var(--vd-mute);
    margin:7px 0 0;
    line-height:1.7;
}
.vd-metaline {
    display:flex;
    flex-wrap:wrap;
    gap:8px 14px;
    align-items:center;
    font-size:13px;
    color:var(--vd-mute);
    border-top:1px solid var(--vd-line-soft);
    border-bottom:1px solid var(--vd-line-soft);
    padding:8px 0;
    margin:0 0 14px;
}
.vd-metaline b {
    color:var(--vd-body);
}
.vd-lede {
    font-size:16.5px;
    color:var(--vd-ink);
    line-height:1.85;
    background:var(--vd-panel);
    border-left:3px solid var(--vd-accent);
    padding:12px 16px;
    margin:0 0 16px;
}
.vd-seg {
    background:var(--vd-bg-soft);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    padding:13px 17px 6px;
    margin:0 0 13px;
}
.vd-segbar {
    display:flex;
    gap:10px;
    align-items:baseline;
    margin:0 0 7px;
}
.vd-segno {
    flex:none;
    background:var(--vd-accent);
    color:#191204;
    font-weight:800;
    font-size:12.5px;
    line-height:1.9;
    padding:0 9px;
    border-radius:5px;
}
.vd-segbar h2 {
    font-size:18px;
    margin:0;
}
.vd-segnav {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin:0 0 14px;
    font-size:13px;
}
.vd-segnav a {
    background:var(--vd-panel);
    border:1px solid var(--vd-line);
    border-radius:999px;
    padding:1px 11px;
    color:var(--vd-body);
}
.vd-tagrow {
    font-size:13.5px;
    color:var(--vd-mute);
    margin:14px 0 4px;
}
.vd-prevnext {
    display:flex;
    justify-content:space-between;
    gap:14px;
    font-size:14px;
    margin:12px 0 4px;
    flex-wrap:wrap;
}
.vd-chanhead {
    display:grid;
    grid-template-columns:1fr 300px;
    gap:18px;
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:12px;
    padding:16px 18px;
    margin:0 0 16px;
    align-items:center;
}
.vd-chanhead img {
    width:100%;
    aspect-ratio:16/9;
    object-fit:cover;
    border-radius:8px;
}
.vd-chanhead p {
    color:var(--vd-body);
    margin:0 0 6px;
}
.vd-chanstats {
    font-size:13px;
    color:var(--vd-mute);
}
.vd-help details {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    padding:11px 15px;
    margin:0 0 10px;
}
.vd-help summary {
    cursor:pointer;
    font-size:16px;
    font-weight:700;
    line-height:1.5;
    color:var(--vd-ink);
}
.vd-help summary::marker {
    color:var(--vd-accent);
}
.vd-help details p {
    margin:.6em 0 .2em;
    color:var(--vd-body);
}
.vd-tagsec {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    padding:6px 16px 10px;
    margin:0 0 14px;
}
.vd-tagsec h2 {
    border-bottom:1px solid var(--vd-line-soft);
    padding-bottom:5px;
    font-size:18px;
    margin-top:10px;
}
.vd-plain {
    background:var(--vd-panel);
    border:1px solid var(--vd-line-soft);
    border-radius:10px;
    padding:8px 18px 12px;
}
.vd-foot {
    background:#0D1015;
    border-top:3px solid var(--vd-accent);
    color:rgb(147,161,179);
    margin-top:30px;
    font-size:13.5px;
}
.vd-footgrid {
    display:grid;
    grid-template-columns:1.7fr 1fr 1fr;
    gap:24px;
    padding:22px 0 4px;
}
.vd-footname {
    font-size:18px;
    font-weight:800;
    color:var(--vd-ink);
    margin:0 0 6px;
}
.vd-foot p {
    margin:0 0 8px;
    line-height:1.75;
}
.vd-footnav {
    display:flex;
    flex-direction:column;
    gap:5px;
}
.vd-foothead {
    font-weight:700;
    margin-bottom:3px;
    color:var(--vd-ink);
}
.vd-footnav a {
    color:#93a1b3;
}
.vd-footnav a:hover {
    color:var(--vd-accent-soft);
}
.vd-footline {
    border-top:1px solid var(--vd-line-soft);
    margin:14px 0 0;
    padding:11px 0 17px;
    font-size:12.5px;
    color:#67758A;
}
@media (max-width: 1020px) {
    .vd-layout {
        grid-template-columns:1fr;
    }
    .vd-row {
        grid-template-columns:repeat(2,1fr);
    }
    .vd-albumgrid {
        grid-template-columns:repeat(2,1fr);
    }
    .vd-grid {
        grid-template-columns:repeat(2,1fr);
    }
}
@media (max-width: 680px) {
    body {
        font-size:15px;
    }
    .vd-sitename {
        font-size:23px;
    }
    .vd-maststats {
        margin-left:0;
        text-align:left;
    }
    .vd-focus {
        grid-template-columns:1fr;
    }
    .vd-row, .vd-row3, .vd-grid {
        grid-template-columns:1fr;
    }
    .vd-chanhead {
        grid-template-columns:1fr;
    }
    .vd-footgrid {
        grid-template-columns:1fr;
    }
    main h1 {
        font-size:22px;
    }
}
@media print {
    .vd-topbar, .vd-mast, .vd-foot {
        display:none;
    }

    body {
        font-size:12pt;
        background:#FFF;
        color:#000;
    }
}
