@font-face {
    font-family: Inter;
    src: url('/fonts/inter-400.2.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Inter;
    src: url('/fonts/inter-500.2.woff2') format('woff2');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: Inter;
    src: url('/fonts/inter-600.2.woff2') format('woff2');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
:root {
    color-scheme: dark;
    --background: #111317;
    --surface: #191c22;
    --text: #f3f4f6;
    --muted: #a6adba;
    --border: #30353f;
    --accent: #ff786b;
}
* { box-sizing: border-box; }
body {
    margin: 0;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: var(--background);
    color: var(--text);
    font-family: Inter, system-ui, sans-serif;
    font-size: 1rem;
    line-height: 1.6;
    font-synthesis: none;
}
a { color: inherit; }
a:focus-visible { outline: 2px solid var(--accent); outline-offset: 6px; }
.container { width: min(1200px, calc(100% - 48px)); margin-inline: auto; }
.main-content.home-page { padding-top: 28px; }
.home-hero { display: grid; grid-template-columns: minmax(0, 1fr) 240px; align-items: center; gap: 40px; padding: 32px; border: 1px solid var(--border); border-radius: 18px; background: radial-gradient(ellipse at top right, #ff786b12, transparent 65%), linear-gradient(135deg, #1d2027, #16191f); }
.home-eyebrow { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; color: #ffad9f; font-size: .625rem; font-weight: 500; letter-spacing: .12em; }
.home-eyebrow > span { width: 5px; height: 5px; flex-shrink: 0; border-radius: 50%; background: var(--accent); }
.home-hero h1 { margin: 0 0 12px; font-size: clamp(1.75rem, 3.4vw, 1.625rem); line-height: 1.2; letter-spacing: -.04em; overflow-wrap: anywhere; }
.home-description { max-width: 640px; margin: 0; color: var(--muted); font-size: .9375rem; line-height: 1.8; overflow-wrap: anywhere; }
.home-choices { display: flex; flex-direction: column; gap: 10px; }
.home-choices a { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 12px 16px; border: 1px solid #ff786b35; border-radius: 10px; background: #ff786b08; text-decoration: none; font-size: .8125rem; font-weight: 500; }
.home-choices svg { color: #ffad9f; flex-shrink: 0; }
.home-choices a > span { margin-left: auto; color: #ffad9f; }
.home-choices a:hover { background: #ff786b16; border-color: #ff786b70; }
.home-section { margin-top: 44px; }
.discovery-hero .discovery-intro { max-width: 850px; margin: 0 0 18px; color: var(--muted); font-size: .9375rem; line-height: 1.85; white-space: pre-line; overflow-wrap: anywhere; }
.discovery-filters { padding-bottom: 24px; margin-bottom: 24px; border-bottom: 1px solid var(--border); }
.discovery-filter-label { display: block; margin-bottom: 12px; font-size: .8125rem; font-weight: 500; color: var(--muted); }
.discovery-filter-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.discovery-filter { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; padding: 8px 12px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: #c4c9d2; font-size: .8125rem; line-height: 1.5; text-decoration: none; overflow-wrap: anywhere; }
.discovery-filter > span { flex-shrink: 0; font-size: .6875rem; color: var(--muted); }
.discovery-filter:hover, .discovery-filter.is-active { border-color: #ff786b70; background: #ff786b12; color: #ffad9f; }
.discovery-filter-clear { display: inline-flex; align-items: center; gap: 6px; padding: 8px; color: #ffad9f; font-size: .75rem; text-decoration: none; }
.discovery-filter-clear:hover { text-decoration: underline; text-underline-offset: 4px; }
.discovery-filter-empty { color: var(--muted); font-size: .8125rem; }
.discovery-card-categories { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.discovery-card-categories .category-card-kind { margin: 0; text-decoration: none; }
.discovery-card-categories a:hover { border-color: #ff786b70; }
.home-section-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 24px; margin-bottom: 22px; }
.home-section-heading h2 { margin: 0; font-size: 1.375rem; line-height: 1.4; letter-spacing: -.025em; overflow-wrap: anywhere; }
.home-section-label { display: block; margin-bottom: 7px; color: #ffad9f; font-size: .625rem; font-weight: 500; letter-spacing: .1em; overflow-wrap: anywhere; }
.home-view-all { display: inline-flex; align-items: center; gap: 12px; color: #ffad9f; font-size: .8125rem; text-decoration: none; }
.home-view-all:hover { text-decoration: underline; text-underline-offset: 4px; }
.discovery-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.discovery-card { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--border); border-radius: 14px; background: linear-gradient(145deg, #1b1e25, #16191f); }
.discovery-card:hover, .discovery-card:focus-within { border-color: #ff786b65; }
.discovery-card-cover { display: block; border-radius: 13px 13px 0 0; overflow: hidden; }
.discovery-card-cover img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
.discovery-card-placeholder { display: grid; place-items: center; aspect-ratio: 16 / 9; background: radial-gradient(ellipse at center, #ff786b14, transparent), #20232b; color: #ffad9f; }
.discovery-card-content { display: flex; flex: 1; flex-direction: column; padding: 22px; overflow-wrap: anywhere; }
.discovery-card-content .discovery-card-categories .category-card-kind { margin: 0; }
.discovery-card-title { margin: 0 0 14px; font-size: 1.125rem; line-height: 1.5; letter-spacing: -.02em; }
.discovery-card-title a { text-decoration: none; }
.discovery-card-title a:hover { color: #ffad9f; }
.discovery-card-content > p { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; margin: 0 0 20px; color: var(--muted); font-size: .9375rem; line-height: 1.8; }
.home-category-section { padding: 28px; border: 1px solid var(--border); border-radius: 16px; background: #15181d; }
.home-category-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.home-category-grid > a { display: flex; flex-direction: column; gap: 10px; padding: 17px; border: 1px solid var(--border); border-radius: 10px; background: #1b1e25; font-size: .875rem; font-weight: 500; text-decoration: none; overflow-wrap: anywhere; }
.home-category-grid > a:hover { border-color: #ff786b65; }
.home-category-count { display: flex; justify-content: space-between; gap: 8px; color: var(--muted); font-size: .6875rem; font-weight: 400; }
.home-category-count > span { color: #ffad9f; }
.home-empty { margin: 0; padding: 24px; border: 1px dashed var(--border); border-radius: 12px; color: var(--muted); font-size: .9375rem; }
.home-about { margin-top: 52px; padding-top: 32px; border-top: 1px solid var(--border); }
.home-about h2 { margin: 0 0 14px; font-size: 1.375rem; line-height: 1.4; overflow-wrap: anywhere; }
.home-about p { max-width: 900px; margin: 0; color: var(--muted); font-size: .9375rem; line-height: 1.9; overflow-wrap: anywhere; }
@media (max-width: 900px) {
    .home-hero { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .home-choices { flex-direction: row; flex-wrap: wrap; }
    .home-choices a { flex: 1; }
    .home-category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .discovery-grid { gap: 16px; }
}
@media (max-width: 700px) {
    .main-content.home-page { padding-top: 20px; }
    .home-hero { padding: 24px 20px; border-radius: 14px; }
    .home-choices a { padding: 10px; gap: 7px; font-size: .75rem; }
    .home-section { margin-top: 32px; }
    .home-section-heading h2 { font-size: 1.25rem; }
    .discovery-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
    .home-category-section { padding: 20px; }
    .home-category-grid { gap: 10px; }
    .home-category-grid > a { padding: 12px; font-size: .8125rem; }
    .home-about { margin-top: 36px; }
}
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-block: 22px; border-bottom: 1px solid var(--border); }
.brand { font-size: 2rem; font-weight: 600; letter-spacing: -.06em; text-decoration: none; }
.brand span { color: var(--accent); }
.header-brand { flex: 0 1 auto; max-width: 280px; line-height: 1.2; }
.header-logo { display: block; max-width: 100%; height: auto; }
.header-nav { flex: 1 1 0; min-width: 0; }
.header-menu { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 6px 8px; list-style: none; padding: 0; margin: 0; }
.header-menu li { min-width: 0; max-width: 100%; }
.header-menu a { display: block; padding: 10px 12px; border-radius: 8px; color: var(--muted); text-decoration: none; font-size: .875rem; font-weight: 500; overflow-wrap: anywhere; transition: color .15s, background .15s; }
.header-menu a:hover, .header-menu a:focus-visible { color: var(--text); background: var(--surface); }
.menu-dropdown { position: relative; }
.menu-dropdown-toggle { display: flex; align-items: center; justify-content: space-between; gap: 8px; border: 0; padding: 10px 12px; border-radius: 8px; background: transparent; color: var(--muted); font: inherit; font-size: .875rem; font-weight: 500; text-align: left; cursor: pointer; overflow-wrap: anywhere; }
.menu-dropdown-toggle svg { flex: 0 0 auto; }
.menu-dropdown-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.menu-dropdown-toggle:hover, .menu-dropdown-toggle[aria-expanded="true"] { color: var(--text); background: var(--surface); }
.menu-dropdown-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.menu-submenu { list-style: none; margin: 6px 0 0; padding: 8px; border: 1px solid var(--border); border-radius: 12px; background: #16191f; }
.menu-submenu[hidden] { display: none; }
.header-menu .menu-submenu { position: absolute; top: 100%; left: 0; z-index: 50; width: 240px; max-width: calc(100vw - 48px); max-height: 60vh; overflow-y: auto; box-shadow: 0 12px 32px #0005; }
.mobile-menu-links .menu-dropdown-toggle { width: 100%; min-height: 48px; padding: 14px 12px; color: var(--text); font-size: .9375rem; font-weight: 400; }
.mobile-menu-links .menu-submenu { margin-left: 12px; }
.mobile-menu-links .menu-submenu a { font-size: .875rem; padding: 10px; min-height: 44px; }
.footer-menu .menu-dropdown-toggle { padding: 2px 0; font-size: inherit; font-weight: inherit; }
.footer-menu .menu-submenu { margin-top: 8px; }
.footer-menu .menu-submenu a { display: block; padding: 7px 8px; }
.random-button { display: inline-flex; align-items: center; justify-content: center; flex: 0 1 auto; gap: 10px; margin-left: auto; max-width: 240px; min-height: 44px; padding: 6px 15px 6px 7px; border: 1px solid #ff786b38; border-radius: 12px; background: linear-gradient(135deg, #272329, #1b1e25); color: #f2e5e2; box-shadow: inset 0 1px 0 #ffffff06, 0 4px 14px #00000014; text-decoration: none; font-size: .8125rem; font-weight: 500; line-height: 1.4; transition: border-color .18s, background .18s, box-shadow .18s; }
.random-button svg { flex-shrink: 0; width: 30px; height: 30px; padding: 6px; border: 1px solid #ff786b20; border-radius: 8px; background: #ff786b10; color: #ffad9f; }
.random-button span { min-width: 0; overflow-wrap: anywhere; }
.random-button:hover { border-color: #ff786b75; background: linear-gradient(135deg, #30272c, #20232b); box-shadow: inset 0 1px 0 #ffffff08, 0 4px 18px #ff786b0c; }
.random-button:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.mobile-menu-toggle{display:none}
.mobile-menu-toggle,.mobile-menu-close{align-items:center;justify-content:center;flex-shrink:0;width:40px;height:40px;padding:0;border:1px solid var(--border);border-radius:9px;background:var(--surface);color:var(--text);cursor:pointer}
.mobile-menu-toggle:focus-visible,.mobile-menu-close:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.mobile-menu-panel{position:fixed;inset:0 0 0 auto;margin:0;width:min(360px,88vw);height:100vh;height:100dvh;max-width:none;max-height:none;box-sizing:border-box;padding:24px;padding-top:max(24px,env(safe-area-inset-top));padding-bottom:max(24px,env(safe-area-inset-bottom));border:0;border-left:1px solid var(--border);background:var(--background);color:var(--text);overflow-y:auto;overscroll-behavior:contain;box-shadow:-16px 0 60px #0005}
.mobile-menu-panel[open]{display:flex;flex-direction:column;animation:mobile-menu-enter .2s ease-out}
.mobile-menu-panel::backdrop{background:#0009}
.mobile-menu-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:22px;border-bottom:1px solid var(--border)}
.mobile-menu-heading h2{font-size:1.125rem}.mobile-menu-close{display:inline-flex;background:transparent}
.mobile-menu-links{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-direction:column;gap:6px}
.mobile-menu-links a{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:48px;padding:14px 12px;border-radius:9px;text-decoration:none;font-size:.9375rem;overflow-wrap:anywhere}
.mobile-menu-links a:hover,.mobile-menu-links a:focus-visible{background:var(--surface);color:var(--accent)}
.mobile-menu-links a span{flex-shrink:0;color:var(--muted)}
body.mobile-menu-open{overflow:hidden}
@keyframes mobile-menu-enter{from{transform:translateX(100%)}to{transform:translateX(0)}}
.empty-state .return-link { display: inline-block; margin-top: 22px; color: var(--accent); text-underline-offset: 4px; }
.list-body { margin-top: 32px; overflow-wrap: anywhere; font-size: .9375rem; line-height: 1.85; font-synthesis: weight style; }
.list-body p { margin: 0 0 20px; }
.list-main-column .list-body > :is(p, h2, h3, h4) { color: #cdd3dc; }
.list-body h2, .list-body h3, .list-body h4 { margin: 32px 0 14px; line-height: 1.4; font-weight: 600; }
.list-body h2 { font-size: 1.6rem; }.list-body h3 { font-size: 1.3rem; }.list-body h4 { font-size: 1.1rem; }
.list-body strong { font-weight: 600; }.list-body em { font-style: italic; }
.list-detail h1 { overflow-wrap: anywhere; }
.main-content.list-detail { padding-top: 28px; }
.list-hero { position: relative; isolation: isolate; padding: 24px 32px; border: 1px solid var(--border); border-radius: 20px; background: radial-gradient(ellipse at 100% 0, #ff786b0c, transparent 65%), linear-gradient(135deg, #1d2027, #16191f); box-shadow: 0 16px 48px #00000018; }
.list-hero::before { content: ''; position: absolute; top: -1px; left: 32px; right: 32px; height: 1px; background: linear-gradient(90deg, transparent, #ff998e70, transparent); pointer-events: none; }
.list-hero .category-breadcrumb { margin-bottom: 14px; font-size: .75rem; line-height: 1.7; }
.list-hero .category-breadcrumb [aria-current="page"] { color: var(--muted); }
.list-hero h1 { margin: 0 0 16px; font-size: clamp(1.375rem, 2.4vw, 1.875rem); line-height: 1.3; letter-spacing: -.03em; text-wrap: balance; }
.list-hero-badges { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.list-hero-badge { display: inline-flex; align-items: center; gap: 7px; min-height: 32px; max-width: 100%; padding: 6px 11px; border: 1px solid #ffffff12; border-radius: 8px; background: #ffffff04; color: #bcc2cd; font-size: .75rem; font-weight: 500; line-height: 1.5; text-decoration: none; overflow-wrap: anywhere; }
.list-hero-badge svg { flex-shrink: 0; color: #919aa9; }
.list-hero-badge span, .list-hero-badge time { min-width: 0; }
.list-hero-category { border-color: #ff786b35; background: #ff786b0d; color: #ffad9f; transition: border-color .15s, background .15s; }
.list-hero-category svg { color: inherit; }
.list-hero-category:hover { border-color: #ff786b80; background: #ff786b1a; }
.list-content-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 32px; align-items: start; margin-top: 32px; }
.list-main-column { min-width: 0; }
.list-share { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px; margin-top: 32px; padding: 20px 22px; border: 1px solid var(--border); border-radius: 12px; background: linear-gradient(120deg, #211e24, #191c22); }
.list-share-heading { flex: 1 1 230px; min-width: 0; }
.list-share-title { display: block; margin: 0 0 5px; font-size: .9375rem; font-weight: 600; line-height: 1.5; }
.list-share-heading p { margin: 0; color: var(--muted); font-size: .75rem; }
.list-share-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.list-share-button { display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 40px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 8px; background: #ffffff03; color: var(--text); font: inherit; font-size: .75rem; line-height: 1.5; cursor: pointer; }
.list-share-button svg { flex-shrink: 0; color: #ffad9f; }
.list-share-native { border-color: #ff786b40; color: #ffad9f; background: #ff786b0c; }
.list-share-button:hover { border-color: #ff786b75; background: #ff786b16; }
.list-share-button:focus-visible, .list-share-manual input:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.list-share .list-share-status { flex-basis: 100%; margin: 0; color: #ffad9f; font-size: .75rem; }
.list-share-status:empty { display: none; }
.list-share-manual { flex-basis: 100%; min-width: 0; color: var(--muted); font-size: .75rem; }
.list-share-manual input { display: block; width: 100%; margin-top: 7px; padding: 10px; border: 1px solid var(--border); border-radius: 7px; background: var(--background); color: var(--text); font: inherit; }
.list-share [hidden] { display: none; }
@media (max-width: 550px) {
    .list-share { padding: 18px; gap: 14px; }
    .list-share-heading, .list-share-actions { flex-basis: 100%; }
    .list-share-button { flex: 1 1 auto; }
    .list-share-manual input { font-size: 1rem; }
}
.list-recommendations { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--border); }
.list-recommendations-heading { margin-bottom: 20px; }
.list-recommendations-heading .list-related-label { display: block; font-size: .625rem; letter-spacing: .08em; }
.list-recommendations h2 { margin: 0; font-size: 1.25rem; line-height: 1.4; }
.list-recommendation-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.list-recommendation-card { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); text-decoration: none; transition: border-color .15s; }
.list-recommendation-card:hover { border-color: #ff786b70; }
.list-recommendation-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #20242d; }
.list-recommendation-placeholder { display: grid; place-items: center; background: linear-gradient(135deg, #29252b, #1d2129); color: #ffad9f; }
.list-recommendation-info { display: flex; flex: 1; flex-direction: column; padding: 16px; overflow-wrap: anywhere; }
.list-recommendation-info h3 { margin: 8px 0 18px; font-size: .9375rem; line-height: 1.6; }
.list-recommendation-link { display: flex; justify-content: space-between; gap: 8px; margin-top: auto; color: #ffad9f; font-size: .75rem; font-weight: 500; }
.list-recommendations-empty { padding: 20px; border: 1px dashed var(--border); border-radius: 12px; color: var(--muted); font-size: .875rem; }
@media (max-width: 800px) {
    .list-recommendation-grid { grid-template-columns: minmax(0, 1fr); }
    .list-recommendations { margin-top: 32px; padding-top: 24px; }
}
.author-box { display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 10px 22px; margin-top: 36px; padding: 26px; border: 1px solid var(--border); border-radius: 16px; background: linear-gradient(135deg, #1d2027, #16191f); overflow-wrap: anywhere; }
.author-box-avatar { grid-row: 1 / 3; width: 72px; height: 72px; border: 1px solid #ff786b35; border-radius: 50%; object-fit: cover; }
.author-box-initial { display: grid; place-items: center; background: #ff786b12; color: #ffad9f; font-size: 1.5rem; font-weight: 600; }
.author-box-heading { align-self: center; }
.author-box-label { display: block; margin-bottom: 5px; color: var(--accent); font-size: .625rem; font-weight: 600; letter-spacing: .12em; }
.author-box-name { margin: 0; font-size: 1.125rem; font-weight: 600; line-height: 1.4; }
.author-box-bio { grid-column: 2; margin: 0; color: var(--muted); font-size: .875rem; line-height: 1.8; }
@media (max-width: 550px) {
    .author-box { grid-template-columns: 56px minmax(0, 1fr); gap: 16px; padding: 20px; margin-top: 28px; border-radius: 12px; }
    .author-box-avatar { grid-row: 1; width: 56px; height: 56px; }
    .author-box-bio { grid-column: 1 / -1; }
}
.list-main-column .list-summary { margin: 0 0 28px; }
.list-main-column .list-body { margin-top: 0; }
.list-body > :first-child { margin-top: 0; }
.media-entry { margin: 32px 0; padding: 26px; border: 1px solid var(--border); border-radius: 16px; background: linear-gradient(145deg, #1b1e25, #16191f); }
.media-entry-top { display: grid; grid-template-columns: minmax(0, 200px) minmax(0, 1fr); gap: 28px; align-items: start; }
.media-entry-visual, .media-entry-info { min-width: 0; }
.media-entry-poster { display: block; width: 100%; height: auto; border-radius: 10px; background: var(--background); }
.media-entry-placeholder { display: grid; place-items: center; aspect-ratio: 2 / 3; padding: 20px; border: 1px dashed var(--border); border-radius: 10px; color: var(--muted); text-align: center; font-size: .8125rem; }
.media-trailer { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 42px; margin-top: 12px; padding: 9px 8px; border: 1px solid #ff786b40; border-radius: 8px; background: #ff786b10; color: #ffad9f; font-size: .8125rem; font-weight: 500; line-height: 1.4; text-decoration: none; }
.media-trailer svg { flex-shrink: 0; }
.media-trailer:hover { background: #ff786b22; border-color: #ff786b80; }
.trailer-dialog { width: min(960px, calc(100% - 32px)); max-width: none; max-height: calc(100dvh - 32px); padding: 0; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); color: var(--text); box-shadow: 0 24px 100px #0009; }
.trailer-dialog::backdrop { background: #080a0de6; }
.trailer-dialog-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; }
.trailer-dialog-heading h2 { margin: 0; font-size: .9375rem; line-height: 1.5; overflow-wrap: anywhere; }
.trailer-dialog-close { display: grid; place-items: center; flex-shrink: 0; width: 40px; height: 40px; padding: 0; border: 1px solid var(--border); border-radius: 8px; background: transparent; color: var(--text); cursor: pointer; }
.trailer-dialog-close:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
.trailer-player { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }
body.trailer-open { overflow: hidden; }
.list-body .media-entry h2 { margin: 0 0 20px; font-size: clamp(1.25rem, 2vw, 1.625rem); line-height: 1.3; letter-spacing: -.025em; }
@media (min-width: 801px) { .list-body .media-entry h2 { margin-top: 10px; } }
.media-entry-facts { margin: 0; font-size: .875rem; }
.media-entry-facts > div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding: 11px 0; border-bottom: 1px solid #ffffff0b; }
.media-entry-facts > div:first-child { padding-top: 0; }
.media-entry-facts > div:last-child { border-bottom: 0; padding-bottom: 0; }
.media-entry-facts dt { color: var(--muted); }
.media-entry-facts dd { margin: 0; }
.media-entry-rating { display: inline-flex; align-items: center; gap: 5px; color: #f2cb77; font-weight: 600; }
.media-rating-max { color: var(--muted); font-size: .75rem; font-weight: 400; }
.media-entry-summary { margin-top: 24px; padding-top: 20px; border-top: 1px solid var(--border); }
.list-body .media-entry-summary h3 { margin: 0 0 10px; font-size: .9375rem; }
.media-entry-summary p { color: #c4c9d2; font-size: .9375rem; }
.media-entry-summary p:last-child { margin-bottom: 0; }
.list-related { min-width: 0; padding: 24px; border: 1px solid var(--border); border-radius: 14px; background: #16191f; overflow-wrap: anywhere; }
.list-related-label { margin: 0 0 8px; color: var(--accent); font-size: .6875rem; font-weight: 500; }
.list-related-title { display: block; margin: 0; font-size: 1.125rem; font-weight: 600; line-height: 1.2; }
.list-related ul { margin: 20px 0 0; padding: 0; list-style: none; }
.list-related li + li { border-top: 1px solid var(--border); }
.list-related a { display: flex; flex-direction: column; gap: 5px; padding: 15px 0; text-decoration: none; font-size: .875rem; line-height: 1.65; }
.list-related li:first-child a { padding-top: 0; }
.list-related li:last-child a { padding-bottom: 0; }
.list-related a:hover { color: var(--accent); }
.list-related-type { color: var(--muted); font-size: .6875rem; }
.list-related-empty { margin: 18px 0 0; color: var(--muted); font-size: .8125rem; line-height: 1.8; }
@media (max-width: 1000px) {
    .list-content-layout { grid-template-columns: minmax(0, 1fr) 250px; gap: 24px; }
    .media-entry { padding: 20px; }
    .media-entry-top { grid-template-columns: minmax(0, 150px) minmax(0, 1fr); gap: 20px; }
    .media-entry-facts > div { grid-template-columns: 1fr; gap: 3px; }
}
@media (max-width: 800px) {
    .list-content-layout { grid-template-columns: minmax(0, 1fr); }
    .media-entry-top { grid-template-columns: minmax(0, 1fr); }
    .media-entry-visual { width: min(60%, 300px); margin-inline: 0; }
    .media-entry-facts > div { grid-template-columns: 88px minmax(0, 1fr); gap: 12px; padding-block: 5px; }
}
@media (max-width: 550px) {
    .list-content-layout { margin-top: 24px; }
    .media-entry { padding: 16px; border-radius: 12px; }
    .media-entry-top { gap: 24px; }
    .list-body .media-entry h2 { font-size: 1.125rem; margin-bottom: 14px; }
    .media-entry-facts { font-size: .8125rem; }
    .media-entry-facts > div { grid-template-columns: 80px minmax(0, 1fr); gap: 10px; padding-block: 5px; }
    .media-entry-summary { margin-top: 18px; padding-top: 16px; }
    .main-content.list-detail { padding-top: 20px; }
    .list-hero { padding: 18px; border-radius: 14px; }
    .list-hero .category-breadcrumb { margin-bottom: 12px; }
    .list-hero h1 { margin-bottom: 14px; }
    .list-hero-badges { flex-wrap: nowrap; gap: 4px; }
    .list-hero-badge { flex: 0 0 auto; gap: 4px; min-height: 28px; padding: 4px 6px; font-size: .625rem; white-space: nowrap; }
    .list-hero-badge svg { width: 12px; height: 12px; }
    .list-hero-category { flex: 0 1 auto; min-width: 0; }
    .list-hero-category span { overflow: hidden; text-overflow: ellipsis; }
}
.corporate-page { overflow-wrap: anywhere; }
.corporate-page h1 { font-size: clamp(1.875rem, 3vw, 2.25rem); line-height: 1.3; letter-spacing: -.03em; }
.corporate-body { margin-top: 36px; font-size: .9375rem; line-height: 1.85; white-space: pre-wrap; font-synthesis: weight style; }
.corporate-body p { margin: 0 0 20px; }
.corporate-body h2, .corporate-body h3, .corporate-body h4 { margin: 32px 0 14px; line-height: 1.4; font-weight: 600; }
.corporate-body h2 { font-size: 1.6rem; }.corporate-body h3 { font-size: 1.3rem; }.corporate-body h4 { font-size: 1.1rem; }
.corporate-body strong { font-weight: 600; }.corporate-body em { font-style: italic; }
.corporate-body a { color: var(--accent); text-underline-offset: 3px; }
.corporate-body ul, .corporate-body ol { padding-left: 28px; margin-block: 18px; }
.corporate-body blockquote { margin: 24px 0; padding: 10px 22px; border-left: 3px solid var(--accent); color: var(--muted); }
.contact-card{margin-top:48px;padding:clamp(24px,5vw,40px);border:1px solid var(--border);border-radius:16px;background:var(--surface)}
.contact-card h2{font-size:clamp(1.5rem,4vw,2rem);letter-spacing:-.03em}.contact-card .eyebrow{font-size:.75rem}
.contact-intro{color:var(--muted);margin:14px 0 28px}.contact-fields{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.contact-form>label,.contact-fields>label{display:block;font-size:.875rem;font-weight:500;margin-bottom:20px}
.contact-form input:not([type=hidden]),.contact-form textarea{display:block;width:100%;margin-top:8px;padding:13px 15px;border:1px solid var(--border);border-radius:9px;background:var(--background);color:var(--text);font:inherit;font-weight:400;line-height:1.6}
.contact-form input::placeholder,.contact-form textarea::placeholder{color:var(--muted);opacity:.8}.contact-form textarea{resize:vertical;min-height:150px}
.contact-form input:focus-visible,.contact-form textarea:focus-visible,.contact-submit:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.contact-submit{display:inline-flex;align-items:center;justify-content:center;gap:24px;min-height:48px;border:0;border-radius:9px;padding:13px 22px;background:var(--accent);color:#25120f;font:inherit;font-weight:600;cursor:pointer}.contact-submit:hover{background:#ff998e}
.contact-notice{padding:14px 18px;border:1px solid;border-radius:9px;margin-bottom:24px}.contact-success{background:#152b24;border-color:#315747;color:#b2e5cf}.contact-error{background:#321e25;border-color:#71424b;color:#ffbec7}
@media(max-width:550px){.contact-fields{grid-template-columns:1fr;gap:0}.contact-form input:not([type=hidden]),.contact-form textarea{font-size:1rem}.contact-submit{width:100%}}
.main-content.category-page { padding-top: 28px; }
.category-breadcrumb { margin-bottom: 24px; font-size: .8125rem; color: var(--muted); }
.category-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.category-breadcrumb li { display: flex; align-items: baseline; gap: 8px; min-width: 0; overflow-wrap: anywhere; }
.category-breadcrumb a { text-decoration: none; }
.category-breadcrumb a:hover { color: var(--accent); text-decoration: underline; text-underline-offset: 4px; }
.category-breadcrumb [aria-current="page"] { color: var(--text); min-width: 0; }
.breadcrumb-separator { color: var(--muted); }
@media (max-width: 800px) {
    .list-hero .category-breadcrumb ol { flex-wrap: nowrap; gap: 6px; }
    .list-hero .category-breadcrumb li { gap: 6px; white-space: nowrap; overflow-wrap: normal; }
    .list-hero .category-breadcrumb li:first-child { flex-shrink: 0; }
    .list-hero .category-breadcrumb li:not(:first-child):not(:last-child) { max-width: 30%; }
    .list-hero .category-breadcrumb li:last-child { flex: 1; min-width: 0; }
    .list-hero .category-breadcrumb a,
    .list-hero .category-breadcrumb [aria-current="page"] { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .list-hero .breadcrumb-separator { flex-shrink: 0; }
}
.category-hero h1 { overflow-wrap: anywhere; }
.category-hero .intro { max-width: 850px; margin-top: 18px; font-size: .9375rem; line-height: 1.85; white-space: pre-line; }
.category-layout { display: grid; grid-template-columns: minmax(0, 1fr) 290px; gap: 32px; align-items: start; margin-top: 32px; }
.category-results { min-width: 0; }
.category-section-heading { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; }
.category-section-heading > span { color: var(--muted); font-size: .75rem; }
.category-section-heading h2 { font-size: 1.125rem; }
.category-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin-top: 24px; }
.list-card { display: flex; flex-direction: column; min-width: 0; padding: 24px; background: linear-gradient(145deg, #1b1e25, #16191f); border: 1px solid var(--border); border-radius: 14px; overflow-wrap: anywhere; transition: border-color .15s; }
.list-card:hover, .list-card:focus-within { border-color: #ff786b65; }
.list-card-image-link { display: block; margin-bottom: 18px; border-radius: 9px; overflow: hidden; }
.list-card-image { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: var(--surface); }
.category-card-kind { display: inline-flex; align-items: center; align-self: flex-start; gap: 6px; margin-bottom: 18px; padding: 5px 9px; border: 1px solid #ff786b25; border-radius: 7px; background: #ff786b09; color: #ffad9f; font-size: .6875rem; line-height: 1.5; }
.category-card-kind svg { flex-shrink: 0; }
.list-card h3 { margin: 0 0 14px; font-size: 1.125rem; line-height: 1.5; letter-spacing: -.02em; }
.list-card h3 a { text-decoration: none; }
.list-card h3 a:hover { color: var(--accent); }
.list-card-summary { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; font-size: .9375rem; line-height: 1.85; color: var(--muted); margin: 0 0 22px; }
.list-card-link { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: auto; padding-top: 16px; border-top: 1px solid #ffffff0b; font-size: .8125rem; font-weight: 500; color: #ffad9f; text-decoration: none; }
.list-card-link span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 7px; background: #ff786b0c; }
.category-sidebar { min-width: 0; padding: 24px; background: #16191f; border: 1px solid var(--border); border-radius: 14px; }
.category-sidebar .eyebrow { font-size: .625rem; margin-bottom: 10px; }
.category-sidebar-title { display: block; margin: 0; font-size: 1.0625rem; font-weight: 600; line-height: 1.2; }
.category-sidebar ul { padding: 0; margin: 22px 0 0; list-style: none; }
.category-sidebar li + li { border-top: 1px solid var(--border); }
.category-sidebar a { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 13px 0; font-size: .875rem; text-decoration: none; overflow-wrap: anywhere; }
.category-sidebar a:hover { color: var(--accent); }
.category-count { flex-shrink: 0; display: inline-flex; justify-content: center; min-width: 27px; padding: 2px 7px; border-radius: 6px; background: #252a33; color: var(--muted); font-size: .75rem; }
.category-sidebar-empty { margin: 16px 0 0; font-size: .8125rem; color: var(--muted); }
.category-pagination { display: flex; justify-content: center; flex-wrap: wrap; align-items: center; gap: 18px; margin-top: 28px; font-size: .875rem; }
.category-pagination a { padding: 9px 14px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); text-decoration: none; }
.category-pagination a:hover { border-color: #ff786b65; color: #ffad9f; }
.category-pagination span { color: var(--muted); }
@media (max-width: 1000px) { .category-layout { grid-template-columns: minmax(0, 1fr) 250px; gap: 24px; } .category-cards { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 800px) { .category-layout { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 550px) {
    .main-content.category-page { padding-top: 20px; }
    .category-layout { margin-top: 24px; }
    .list-card { padding: 20px; }
    .category-pagination { gap: 10px; font-size: .75rem; }
}
@media (max-width: 900px) {
    .site-header { flex-wrap: nowrap; gap: 10px; padding-block: 12px; }
    .header-brand { display:flex;align-items:center;flex:1 1 auto;min-width:0;max-width:none;height:40px;font-size:1.5rem;white-space:nowrap;overflow:hidden; }
    .header-logo { width:auto;max-width:min(160px,100%);max-height:32px;object-fit:contain; }
    .random-button { flex:0 1 auto;min-width:0;max-width:160px;height:40px;min-height:40px;padding:0 9px 0 6px;gap:6px;border-radius:9px;font-size:.75rem;box-shadow:none; }
    .random-button svg { width:24px;height:24px;padding:4px;border-radius:6px; }
    .random-button span { white-space:nowrap;overflow:hidden;text-overflow:ellipsis; }
    .mobile-menu-toggle:not([hidden]) { display:inline-flex; }
    .header-nav { display:none; }
    /* Keep navigation usable if JavaScript is unavailable. */
    .site-header:has(.mobile-menu-toggle[hidden]){flex-wrap:wrap}
    .site-header:has(.mobile-menu-toggle[hidden]) .header-nav{display:block;order:3;flex:1 0 100%}
}
@media (prefers-reduced-motion: reduce) { .random-button, .header-menu a { transition: none; } .random-button:hover { transform: none; } .mobile-menu-panel[open]{animation:none} }
.main-content { flex: 1; padding-block: 64px 80px; }
.eyebrow { color: var(--accent); font-size: .875rem; font-weight: 600; letter-spacing: .12em; margin: 0 0 16px; }
h1, h2, h3 { font-weight: 600; line-height: 1.2; }
h1 { font-size: clamp(2.25rem, 6vw, 4rem); letter-spacing: -.045em; margin: 0 0 20px; }
.intro { color: var(--muted); margin: 0; font-size: 1.125rem; }
.recommendations { margin-top: 64px; }
.section-heading { padding-bottom: 20px; border-bottom: 1px solid var(--border); }
h2 { margin: 0; font-size: 1.25rem; }
.empty-state { margin-top: 24px; padding: 48px 24px; text-align: center; background: var(--surface); border: 1px solid var(--border); border-radius: 12px; }
h3 { margin: 0 0 12px; font-size: 1.125rem; }
.empty-state p { margin: 0; color: var(--muted); }
.site-footer { background: #0d0f13; border-top: 1px solid var(--border); font-size: .875rem; color: var(--muted); overflow-wrap: anywhere; }
.footer-main { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 72px; padding-block: 52px 48px; }
.footer-main > * { min-width: 0; }
.footer-brand { display: inline-block; max-width: 100%; color: var(--text); text-decoration: none; }
.footer-brand .brand { font-size: 1.75rem; }
.footer-logo { display: block; max-width: 100%; height: auto; }
.footer-description { max-width: 360px; margin: 18px 0 0; line-height: 1.85; }
.footer-menu-title { display: block; margin: 4px 0 18px; font-size: .875rem; font-weight: 600; color: var(--text); line-height: 1.5; }
.cookie-preferences { padding: 2px 0; border: 0; background: transparent; color: var(--muted); font: inherit; cursor: pointer; text-underline-offset: 4px; }
.cookie-preferences:hover { color: var(--text); text-decoration: underline; }
.cookie-notice { position: fixed; z-index: 100; right: 24px; bottom: max(24px, env(safe-area-inset-bottom)); width: min(370px, calc(100% - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; padding: 20px; border: 1px solid #ff786b40; border-radius: 16px; background: linear-gradient(135deg, #242027, #191c22 70%); box-shadow: 0 16px 50px #0006, inset 0 1px 0 #ffffff08; }
.cookie-notice[hidden], .cookie-preferences[hidden] { display: none; }
.cookie-notice-heading { display: flex; align-items: center; gap: 11px; color: var(--text); font-size: .875rem; font-weight: 600; line-height: 1.5; }
.cookie-notice-icon { display: grid; place-items: center; flex: 0 0 36px; height: 36px; border-radius: 10px; background: #ff786b12; color: #ffad9f; }
.cookie-notice p { margin: 12px 0 16px; color: var(--muted); font-size: .8125rem; line-height: 1.7; }
.cookie-notice-actions { display: flex; gap: 10px; }
.cookie-choice { flex: 1; min-width: 0; min-height: 42px; padding: 10px 14px; border: 1px solid var(--border); border-radius: 9px; font: inherit; font-size: .8125rem; font-weight: 600; cursor: pointer; }
.cookie-choice-accept { border-color: var(--accent); background: var(--accent); color: #211513; }
.cookie-choice:hover { filter: brightness(1.1); }
.cookie-choice:focus-visible, .cookie-preferences:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@media (max-width: 600px) { .cookie-notice { left: 50%; right: auto; transform: translateX(-50%); bottom: max(16px, env(safe-area-inset-bottom)); padding: 17px; border-radius: 14px; } }
.footer-menu { list-style: none; padding: 0; margin: 0; }
.vertical-menu { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
.footer-menu a { text-decoration: none; display: inline-block; padding-block: 2px; transition: color .15s; }
.footer-menu a:hover { color: var(--text); text-decoration: underline; text-underline-offset: 4px; }
.footer-empty { margin: 0; color: #969daa; font-size: .8125rem; }
.footer-bottom { border-top: 1px solid #272b33; padding-block: 22px; display: flex; align-items: flex-start; justify-content: space-between; gap: 20px 32px; font-size: .8125rem; }
.footer-copyright { margin: 0; flex: 1; min-width: 0; }
.footer-bottom-nav { max-width: 60%; }
.horizontal-menu { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px 24px; }
@media (max-width: 760px) {
    .footer-main { grid-template-columns: 1fr 1fr; gap: 32px; padding-block: 36px; }
    .footer-brand-column { grid-column: 1 / -1; }
    .footer-description { max-width: 540px; }
    .footer-bottom { flex-direction: column; gap: 14px; }
    .footer-bottom-nav { max-width: 100%; }
    .horizontal-menu { justify-content: flex-start; gap: 8px 20px; }
}
@media (max-width: 380px) { .footer-main { grid-template-columns: 1fr; gap: 28px; } }
.brand, .intro { overflow-wrap: anywhere; min-width: 0; }
@media (max-width: 480px) {
    .main-content { padding-block: 40px 56px; }
    .recommendations { margin-top: 40px; }
    .site-header { gap: 8px; }
    .header-brand { font-size: 1.25rem; }
    .random-button { max-width:128px; }
    .header-menu a { padding: 10px; }
}