:root {
--bg: #0f1115;
--bg-elev: #2a20a0;
--card: #1b1f2a;
--border: #222737;
--muted: #9aa4b2;
--text: rgb(242 242 242);
--brand: #5b8cff;
--brand-2: #a679ff;
--accent: #10b981; --danger: #ef4444;
--radius-sm: 8px;
--radius-md: 12px;
--radius-lg: 16px;
--shadow-1: 0 2px 10px rgba(0, 0, 0, .25);
--shadow-2: 0 12px 30px rgba(0, 0, 0, .28);
--ring: 0 0 0 3px rgba(91, 140, 255, .35);
--speed: .18s;
}
@media (prefers-color-scheme: light) {
:root {
--bg: #f7f8fb;
--bg-elev: #ffffff;
--card: #b7a7a9;
--border: #e6e8f0;
--muted: #667085;
--text: rgb(236 236 226);
--brand: #3b82f6;
--brand-2: #8b5cf6;
--accent: #059669;
--danger: #dc2626;
--shadow-1: 0 2px 12px rgba(0, 0, 0, .06);
--shadow-2: 0 20px 40px rgba(0, 0, 0, .08);
--ring: 0 0 0 3px rgba(59, 130, 246, .35);
}
} html {
scroll-behavior: smooth;
}
body {
background: radial-gradient(1200px 900px at 70% -10%, rgba(91, 140, 255, .12), transparent 60%),
linear-gradient(180deg, var(--bg), var(--bg));
color: var(--text);
font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, "Helvetica Neue", Arial, "Noto Sans", "Apple Color Emoji", "Segoe UI Emoji";
letter-spacing: .2px;
} :where(a, button, [role="button"], input, select, textarea):focus-visible {
outline: none;
box-shadow: var(--ring);
border-radius: var(--radius-sm);
transition: box-shadow var(--speed) ease;
} @media (prefers-reduced-motion: reduce) {
*,
*::before,
*::after {
animation: none !important;
transition: none !important;
}
} .top-bar {
background: color-mix(in oklab, var(--bg-elev) 92%, black 8%);
border-bottom: 1px solid var(--border);
box-shadow: none;
}
.site-branding {
min-height: unset;
padding: 1.25rem 1.5rem;
align-items: center;
gap: 1rem;
}
.site-title,
.site-branding .logo a {
color: var(--text);
font-weight: 800;
letter-spacing: .2px;
} #site-navigation {
height: 56px;
line-height: 56px;
background: var(--bg-elev);
border-bottom: 1px solid var(--border);
}
#site-navigation>ul>li>a {
color: var(--text);
font-weight: 600;
transition: color var(--speed) ease, background var(--speed) ease;
}
#site-navigation>ul>li:hover>a,
#site-navigation ul li.current-menu-item>a {
background: transparent;
color: var(--brand);
} #site-navigation ul ul {
background: var(--bg-elev);
border: 1px solid var(--border);
box-shadow: var(--shadow-1);
}
#site-navigation ul ul li:hover>a {
background: rgba(91, 140, 255, .08);
color: var(--text);
} @media screen and (max-width: 991.98px) {
#site-navigation .button-nav {
top: 0;
}
#site-navigation ul {
top: 56px;
}
} button,
.button,
input[type="submit"],
.label,
.pagination ul li a,
.comment-reply-link,
a.tag-cloud-link,
.template-actors li a {
background: linear-gradient(180deg, color-mix(in oklab, var(--brand) 92%, white 8%), var(--brand));
border: 1px solid color-mix(in oklab, var(--brand) 80%, black 20%);
border-radius: var(--radius-sm);
text-shadow: none;
box-shadow: 0 1px 0 rgba(255, 255, 255, .04) inset, 0 1px 1px rgba(0, 0, 0, .18);
transition: transform var(--speed) ease, box-shadow var(--speed) ease, background var(--speed) ease;
}
button:hover,
.button:hover,
input[type="submit"]:hover,
.pagination ul li a:hover {
transform: translateY(-1px);
box-shadow: 0 2px 12px rgba(91, 140, 255, .3);
}
.label.secondary,
.pagination ul li a {
background: var(--card) !important;
border-color: var(--border) !important;
} a.tag-cloud-link {
background: var(--card);
color: var(--text);
border-color: var(--border);
}
a.tag-cloud-link:hover {
background: color-mix(in oklab, var(--brand) 14%, var(--card));
} .button.danger {
background: var(--danger);
border-color: color-mix(in oklab, var(--danger) 80%, black 20%);
}
.button.success {
background: var(--accent);
border-color: color-mix(in oklab, var(--accent) 80%, black 20%);
} input,
select,
textarea,
.wp-editor-container {
background: var(--bg-elev) !important;
border: 1px solid var(--border) !important;
color: var(--text) !important;
border-radius: var(--radius-sm);
height: 42px;
}
textarea {
min-height: 12rem;
}
input::placeholder,
textarea::placeholder {
color: var(--muted);
} .thumb-block .post-thumbnail {
background: #000;
border-radius: var(--radius-md);
overflow: hidden;
padding-bottom: 56.25% !important; box-shadow: var(--shadow-1);
}
.thumb-block .post-thumbnail img,
.video-preview-item img.preview-thumb {
transition: transform .35s ease, filter .35s ease, opacity .35s ease;
}
.thumb-block:hover .post-thumbnail img {
transform: scale(1.04);
filter: saturate(1.06) contrast(1.02);
}
.play-icon-hover i {
opacity: .9;
}
span.views,
span.duration,
span.hd-video {
background: rgba(15, 17, 21, .8);
border: 1px solid rgba(255, 255, 255, .08);
border-radius: 6px;
backdrop-filter: blur(2px);
font-weight: 600;
} .thumb-block .entry-header {
color: var(--text);
height: 3.2em;
font-weight: 600;
} .categories-list .thumb-block .entry-header,
.actors-list .thumb-block .entry-header {
background: var(--card) !important;
border-color: var(--border);
border-radius: var(--radius-sm);
} .rating-bar {
background: var(--card) !important;
border-color: var(--border);
height: 10px;
border-radius: 999px;
overflow: hidden;
}
.rating-bar-meter {
background: linear-gradient(90deg, var(--accent), var(--brand));
} .title-block {
background: var(--card);
border: 1px solid var(--border);
border-left-width: 6px;
border-left-color: var(--brand);
border-radius: var(--radius-md);
box-shadow: var(--shadow-1);
}
.title-block h1.entry-title {
color: var(--text);
border: none;
font-weight: 800;
letter-spacing: .2px;
} .breadcrumbs-area {
background: var(--card) !important;
border-color: var(--border);
border-radius: var(--radius-sm);
height: auto;
line-height: normal;
padding: .5rem 1rem;
} .video-js .vjs-control-bar {
background: var(--card) !important;
border-color: var(--border);
backdrop-filter: blur(6px);
}
.vjs-big-play-centered .vjs-big-play-button {
border-radius: 999px;
background: rgba(0, 0, 0, .35);
border: 1px solid rgba(255, 255, 255, .16);
} .pagination ul {
padding-top: 1.25em;
}
.pagination ul li a {
background: var(--card);
border-color: var(--border);
color: var(--text);
font-weight: 600;
border-radius: var(--radius-sm);
}
.pagination ul li a.current {
background: linear-gradient(180deg, color-mix(in oklab, var(--brand) 92%, white 8%), var(--brand));
border-color: color-mix(in oklab, var(--brand) 80%, black 20%);
} .site-footer {
background: var(--bg-elev);
border-top: 1px solid var(--border);
box-shadow: none;
}
.footer-text {
opacity: .65;
} .container-narrow {
max-width: 1100px;
margin-inline: auto;
padding-inline: 1rem;
}
.card {
background: var(--card);
border: 1px solid var(--border);
border-radius: var(--radius-md);
box-shadow: var(--shadow-1);
padding: 1rem;
}
#back-to-top {
background: var(--card);
border: 1px solid var(--border);
border-radius: 10px;
padding: .35rem .55rem;
box-shadow: var(--shadow-1);
}
.top-bar .social-share a {
background: var(--card);
}
.top-bar .social-share i {
color: var(--muted);
} @media (max-width: 640px) {
.site-branding {
padding: .875rem 1rem;
}
.title-block {
margin: .75rem 0 1rem;
}
.thumb-block .entry-header {
font-size: .95rem;
height: 2.8em;
}
.happy-under-player,
.happy-under-player-mobile {
margin-top: 1rem;
}
}