/* 02 · Noir & Champagne — color and surface treatments only. */
:root {
  --background: #0b0a08;
  --panel: #1d1a16;
  --panel-hover: #2b261e;
  --text: #f4eddf;
  --muted: #b8af9e;
  --accent: #d8bd83;
  --accent-end: #b7955a;
  --line: #3b3429;
  --gradient: linear-gradient(115deg, #e4d0a6 0%, #c3a268 100%);
}

body { background: var(--background); color: var(--text); }
::selection { background: #d8bd83; color: #18130b; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
video:focus-visible { outline-color: #e4cca0; }

.site-header {
  background: linear-gradient(180deg, #14120f 0%, #14120ff7 70%, #14120feb 100%);
  box-shadow: 0 1px 0 #d8bd8312;
}
.brand-name { color: #f5eddd; }
.brand-mark { background: none; box-shadow: none; }
.main-nav > a,
.main-nav > button,
.nav-trigger,
.language-button,
.user-button,
.menu-button { color: #e6dece; }
.main-nav > a:hover,
.main-nav > button:hover,
.main-nav .is-active,
.main-nav [aria-current='page'],
.nav-trigger:hover,
.language-button:hover,
.user-button:hover { color: var(--accent); }
.header-search { background: #242019; color: #c4b9a5; box-shadow: inset 0 0 0 1px #d8bd8314; }
.header-search input { background: transparent; color: #f6efdf; }
.header-search input::placeholder,
.header-search button { color: #b6aa95; }
.header-search:focus-within { box-shadow: 0 0 0 1px #bda471, inset 0 0 0 1px #d8bd831a; }
.avatar { background: #2d271e; color: #d0bd98; }
.nav-menu,
.language-menu,
.user-menu { background: #201c16; border-color: #4c402e; box-shadow: 0 18px 42px #0009, inset 0 1px 0 #f1d8a410; }
.nav-menu a,
.nav-menu button,
.language-menu button,
.user-menu a,
.user-menu button { color: #e6ddcc; }
.language-menu p { color: #b8ab94; }
.nav-menu a:hover,
.nav-menu button:hover,
.language-menu button:hover,
.user-menu a:hover,
.user-menu button:hover { background: #332a1d; color: #ead2a4; }

.hero-stage {
  background: radial-gradient(ellipse 20% 20% at 50% 0%, #d9bc8140 0%, transparent 100%), radial-gradient(ellipse 65% 17% at 50% 88%, #b99b633b 0%, transparent 90%), linear-gradient(90deg, #241a0e 0%, #0d0c09 20%, #090908 50%, #0d0c09 80%, #241a0e 100%);
}
.hero-stage::before { background: repeating-linear-gradient(100deg, #120e08 0, #46341a 15px, #241a0d 32px, #100d09 54px); }
.hero-stage::after { border-bottom-color: #bca373; box-shadow: 0 7px 8px -7px #e3d0a6; }
.hero-item[data-offset] .hero-poster { border-radius: 10px; box-shadow: 0 18px 34px #000c, 0 0 0 1px #d6bd8529; }
.hero-caption { color: #f5e8d0; text-shadow: 0 2px 6px #000; }
.hero-overlay { border-radius: 10px; background: linear-gradient(transparent 40%, #0d0903ad); }
.hero-prev,
.hero-next { background: #3c3327b8; color: #f2e6ce; box-shadow: inset 0 0 0 1px #d1b47826; }
.hero-prev:hover,
.hero-next:hover { background: #5d4b2bd9; color: #fff3dc; }
.hero-dot { background: #786c55; box-shadow: 0 0 0 4px transparent; }
.hero-dot.is-active { background: #e4cca0; box-shadow: 0 0 8px 2px #cfb07261; }

.section-heading h2,
.page-heading h1,
.filters h2 { color: #f2e8d6; }
.section-heading > a { color: #bdaf96; }
.section-heading > a:hover { color: #e0c38b; }
.poster-wrap { background: #211d16; border-radius: 4px; box-shadow: 0 0 0 1px #d8bd8312; }
.source-badge { background: #17130ed9; border-color: #d6bd8545; color: #f2e6cf; }
.card-hover { background: #130d055c; }
.card-hover svg { color: #f7e8c8; }
.card-title { color: #f1e8d7; }
.drama-card:hover .card-title { color: #e4cca0; }
.card-genres { color: #b6ac98; }
.rail-arrow { background: #292218ed; color: #e7d2a8; border-radius: 4px; box-shadow: 0 3px 15px #0009, inset 0 0 0 1px #b89c6330; }
.rail-arrow:hover { background: #3b3020; color: #f9e5b9; }

.breadcrumbs,
.page-heading p,
.page-description,
.filter-label { color: #b8ac97; }
.breadcrumbs span:last-child { color: #e8dcc5; }
.breadcrumbs a:hover { color: #e0c38b; }
.chip { background: #252016; color: #dbcfba; border-radius: 5px; }
.chip:hover { background: #3a3021; color: #f1dfbd; }
.chip.is-active { background: var(--gradient); color: #19140c; box-shadow: inset 0 0 0 1px #f4dcaa52; }
.pagination a,
.pagination button { color: #c7b99f; background: #242016; border-radius: 4px; }
.pagination a:hover,
.pagination button:hover { color: #f8e9ca; background: #3a3021; }
.pagination .is-active,
.pagination .is-active:hover { background: var(--gradient); color: #19140c; }

.platform-card,
.article-card { background: #191713; border-color: #3c3325; border-radius: 7px; box-shadow: inset 0 1px 0 #efdbb108; }
.platform-card:hover,
.article-card:hover { background: #252017; border-color: #856b3e; }
.platform-card h2 { color: #f1e6d0; }
.platform-count { color: #b7ab96; }
.platform-card > span:not(.platform-logo),
.platform-card > a { color: #c9b898; }
.platform-card > a:hover { color: #e8cb91; }
.platform-initial { background: var(--gradient); color: #19140c; }
.empty-state { color: #bbaf99; }
.empty-state > svg { color: #9d865b; }
.empty-state h2 { color: #eee1c8; }
.profile-tabs { border-bottom-color: #3c3325; }
.profile-tabs a,
.profile-tabs button { color: #bdae92; }
.profile-tabs .is-active { color: #19140c; }
.profile-tabs .is-active::after { background: var(--gradient); }
.tags a,
.tags span { background: #2a241a; color: #cabc9f; }
.tags a:hover { background: #3a3020; color: #f2dfb9; }

.player-frame,
.player-frame > video { background: #050504; }
.video-center-play { background: #1711089e; color: #f0d8ab; box-shadow: inset 0 0 0 1px #dbc28d63, 0 5px 25px #0008; }
.player-controls { background: linear-gradient(transparent, #080602d9); color: #f2e7d1; }
.player-controls .icon-button { color: #f2e7d1; }
.player-controls .icon-button:hover { color: #f9e7c1; background: #b38c4430; }
.player-description p,
.episode-description,
.story-synopsis { color: #c2b59e; }
.episode-panel h1,
.episode-panel h2,
.player-description h2,
.story-synopsis h2 { color: #f1e5cf; }
.episode-meta,
.catalog-meta { color: #b8ac95; }
.episode-tabs { border-bottom-color: #443925; }
.episode-tabs button,
.episode-tabs a { color: #c6b697; }
.episode-tabs .is-active { color: #e1c38a; }
.episode-tabs .is-active::after { background: var(--gradient); }
.episode-tabs .chip { background: #282117; color: #c8b99d; }
.episode-tabs .chip.is-active { background: var(--gradient); color: #19140c; box-shadow: inset 0 0 0 1px #f4dcaa52; }
.episode-grid { scrollbar-color: #77613a transparent; }
.episode-button { background: #282219; color: #e3d6bd; border-color: transparent; border-radius: 4px; }
.episode-button:hover { background: #3a3020; color: #f4e3bf; }
.episode-button.locked { color: #aa9b81; }
.episode-button svg { color: #b7a27b; }
.episode-button.is-active,
.episode-button.locked.is-active { border-color: #d5b87c; background: #d5b87c21; color: #ead1a2; }
.episode-button.is-active svg { color: #ead1a2; }
.download-overlay { background: #060503c7; }
.download-card { background: #211c14; color: #f2e3c8; border-radius: 9px; box-shadow: 0 18px 54px #000b, inset 0 0 0 1px #8a704448; }
.download-card p { color: #c8b99c; }
.download-card small { color: #b7a78b; }
.episode-drawer { background: #1e1a13; box-shadow: 0 -12px 45px #0009, inset 0 1px 0 #806d454a; }
.drawer-backdrop { background: #050403b3; }
.mobile-player-bar { background: #211c14; color: #f0e3ca; border-bottom-color: #483c27; }
.mobile-player-bar button { color: #e3c894; }
.mobile-player-bar > div > span { color: #bbab8d; }
.video-unavailable { background: radial-gradient(ellipse at 50% 30%, #352b1b, #10100c 75%); color: #e6d8bc; }
.video-unavailable > svg { color: #b49a67; }
.video-unavailable p { color: #bdad8e; }
.catalog-meta select,
.speed-select { background: #211b12; color: #e5d4b2; border-color: #645031; }
.speed-select option { background: #211b12; color: #f1e3c8; }
.watch-toolbar button { color: #bfaf90; }
.watch-toolbar button:hover,
.watch-toolbar button.is-active { color: #e0c38a; }
.watch-toolbar .button-outline { color: #dfd0b3; }
.watch-toolbar .button-outline.is-active { border-color: #d8bd83; color: #e8cf9b; background: #d8bd8310; }

.site-footer { background: #100e0b; color: #b5a991; border-top-color: #3a3021; }
.footer-grid .brand,
.footer-grid h2,
.footer-grid h3 { color: #eadcc2; }
.footer-links a:hover,
.footer-bottom a:hover { color: #e4c68c; }
.footer-bottom { border-top-color: #3b3121; color: #a99b80; }
.modal-backdrop { background: #050403c7; }
.modal-card { background: #201b13; border-color: #675133; border-radius: 10px; box-shadow: 0 25px 85px #000b, inset 0 1px 0 #e4c78717; }
.modal-close { color: #c7b694; }
.modal-close:hover { background: #d2b5781c; color: #f1dbb0; }
.modal-title { color: #f2e4ca; }
.modal-body { color: #c9b99c; }
.modal-body .brand { color: #f4e7cc; }
.modal-body label { color: #e5d6b6; }
.modal-body input { background: #14110b; border-color: #665235; color: #f5e8ca; }
.modal-body .form-help { color: #bbaa8a; }
.toast { background: #302719; border-color: #aa8b53; color: #f5e4c2; border-radius: 6px; box-shadow: 0 8px 28px #0009; }
.preview-label { background: #1e1a13e8; border-color: #76633c66; color: #c5b695; }

.content-page p,
.content-page li,
.prose { color: #c2b59e; }
.content-page summary,
.prose h1,
.prose h2,
.prose h3 { color: #f2e4ca; }
.content-page details { border-bottom-color: #463a25; }
.content-page a,
.prose a { color: #dfc38c; }
.article-number { color: #ad9465; }
.article-card > span:last-child { color: #d6c49f; }
.article-card > img,
.article-card > a > img { background: #211b13; }
.article-card h2 { color: #efe0c2; }
.article-card:hover h2 { color: #e8c98e; }
.article-card p { color: #baad93; }
.article-card time { color: #ae9d7b; }
.prose .article-summary { color: #ddccad; }
.profile-header p,
.resume-card p { color: #b8aa8e; }
.resume-card h3 { color: #f1e3c8; }
.resume-card > img { border-radius: 4px; box-shadow: 0 0 0 1px #c2a46825; }
.resume-card > svg { color: #f4dfb8; }
.resume-card .resume-progress { background: #d7bd8338; }
.resume-card .resume-progress > span { background: var(--gradient); }
.input { background: #211c13; border-color: #615033; color: #f4e8ce; }
.input::placeholder { color: #b4a387; }

.button,
.prose .button,
.prose a.button,
.skip-link { background: var(--gradient); color: #19140c; border-radius: 5px; box-shadow: inset 0 0 0 1px #f4dcaa4d; }
.button:hover,
.prose .button:hover,
.prose a.button:hover { color: #17120a; }
.button-outline { color: #dfceb0; border-color: #77603c; background: transparent; border-radius: 5px; }
.button-outline:hover { background: #d8bd8312; color: #f3ddb5; border-color: #b3965d; }
.favorite-button.is-active { color: #e3c48b; border-color: #c4a266; background: #d8bd8310; }
.icon-button { color: #d0bea0; }
.icon-button:hover { background: #d1b77e1a; color: #f1dbad; }