/*
Theme Name:   BOM Lite
Theme URI:    https://baapofmovies.com
Author:       Baap of Movies
Description:  Custom lightweight theme for Baap of Movies — no page builder, no bloat.
Version:      0.6.0
Requires PHP: 7.4
Text Domain:  bom-lite
*/

/* ========== 1. Design tokens ========== */
:root {
	--bom-bg: #ffffff;
	--bom-card: #ffffff;
	--bom-surface: #f1ede3;
	--bom-text: #15130e;
	--bom-muted: #6b6453;
	--bom-border: #e6dfcc;
	--bom-gold: #8a6400;
	--bom-img: #e7e1d2;
	--bom-dark: #15130e;
	--bom-brand: #ffc400;
	--bom-brand-text: #15130e;
	--bom-accent: #e23744;
	--bom-radius: 14px;
	--bom-max: 1280px;
	--bom-font: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
	--bom-head: "Bricolage Grotesque", Inter, -apple-system, "Segoe UI", sans-serif;
	color-scheme: light;
}
[data-theme="dark"] {
	--bom-bg: #0f0e0b;
	--bom-card: #1b1914;
	--bom-surface: #232019;
	--bom-text: #f4efe2;
	--bom-muted: #a39b86;
	--bom-border: #2e2a22;
	--bom-gold: #ffc400;
	--bom-img: #2b271f;
	--bom-dark: #1b1914;
	color-scheme: dark;
}

/* ========== 2. Reset ========== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--bom-bg);
	color: var(--bom-text);
	font: 16px/1.6 var(--bom-font);
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--bom-text); text-decoration: underline; }
h1, h2, h3, h4 { line-height: 1.25; margin: 0 0 .5em; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap;
}
.skip-link:focus {
	position: fixed; top: 8px; left: 8px; z-index: 999; width: auto; height: auto; clip: auto;
	background: var(--bom-brand); color: var(--bom-brand-text); padding: 8px 12px;
}

/* ========== 3. Layout ========== */
.bom-container { max-width: var(--bom-max); margin: 0 auto; padding: 0 16px; }
.bom-main { padding: 24px 0 48px; min-height: 60vh; }

/* ========== 5. Post list ========== */
.bom-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.bom-card { background: var(--bom-bg); border: 1px solid var(--bom-border); border-radius: var(--bom-radius); overflow: hidden; }
.bom-card__thumb { aspect-ratio: 16 / 9; background: var(--bom-surface); overflow: hidden; }
.bom-card__thumb img { width: 100%; height: 100%; object-fit: cover; }
.bom-card__body { padding: 12px 14px 14px; }
.bom-card__title { font-size: 17px; margin: 0 0 6px; }
.bom-meta { color: var(--bom-muted); font-size: 13px; }

/* ========== 6. Single ========== */
.bom-article { max-width: 880px; margin: 0 auto; }
.bom-article__title { font-size: clamp(26px, 4vw, 36px); }
.bom-article__thumb { margin: 16px 0; border-radius: var(--bom-radius); overflow: hidden; }
.bom-content { font-size: 18px; line-height: 1.75; }
.bom-content a { color: #0b57d0; text-decoration: underline; }
.bom-content table { width: 100%; border-collapse: collapse; margin: 1em 0; font-size: 15px; }
.bom-content th, .bom-content td { border: 1px solid var(--bom-border); padding: 8px 10px; text-align: left; }
.bom-content th { background: var(--bom-surface); }

/* ========== 7. Pagination ========== */
.bom-pagination { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 32px; }
.bom-pagination .page-numbers {
	padding: 8px 14px; border: 1px solid var(--bom-border); border-radius: 6px; font-weight: 600;
}
.bom-pagination .page-numbers.current,
.bom-pagination a.page-numbers:hover { background: var(--bom-brand); color: var(--bom-brand-text); border-color: var(--bom-brand); text-decoration: none; }

/* ========== 8. Footer ========== */
.bom-footer { background: #000; color: #bbb; padding: 32px 0; font-size: 14px; }
.bom-footer a { color: #fff; }
.bom-footer ul { list-style: none; display: flex; flex-wrap: wrap; gap: 16px; margin: 0 0 16px; padding: 0; }

/* ========== 9. Mobile ========== */
@media (max-width: 768px) {
	.bom-header__inner { height: auto; flex-wrap: wrap; padding: 10px 0; gap: 8px; }
	.bom-nav { order: 3; flex-basis: 100%; }
	.bom-search { margin-left: auto; }
	.bom-search input { width: 130px; }
	.bom-content { font-size: 17px; }
}

/* ========== 10. Article header (author, dates, share) ========== */
.bom-meta-box{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:nowrap;margin:12px 0 16px;padding:14px 16px;border:1px solid var(--bom-border);border-radius:14px;background:var(--bom-surface)}
.bom-meta-box__who{display:flex;gap:12px;align-items:center;min-width:0}
.bom-meta-box__ava{width:44px;height:44px;border-radius:50%;flex:none}
.bom-meta-box__by{font-size:15px;font-weight:700}
.bom-meta-box__by a{color:#b37a00;text-decoration:none}
.bom-meta-box__read{color:var(--bom-muted);font-weight:500}
.bom-meta-box__dates{font-size:13px;color:var(--bom-text);margin-top:2px}
.bom-meta-box__upd{color:var(--bom-muted)}
.bom-meta-box__src{font-size:12.5px;color:var(--bom-muted);margin-top:2px}
.bom-meta-box__actions{display:flex;flex-direction:column;align-items:stretch;gap:8px;flex:none;min-width:250px}
.bom-share{display:flex;align-items:center;justify-content:flex-end;gap:6px}
.bom-share__lbl{font-size:11px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--bom-muted);margin-right:2px}
.bom-share a,.bom-share button{--c:#15130e;display:grid;place-items:center;width:36px;height:36px;padding:0;border-radius:11px;border:1px solid var(--bom-border);background:#fff;color:var(--c)!important;cursor:pointer;text-decoration:none!important;transition:background .15s,color .15s,border-color .15s,transform .15s}
.bom-share a:hover,.bom-share button:hover{background:var(--c);border-color:var(--c);color:#fff!important;transform:translateY(-2px)}
.bom-share__x{--c:#000!important}.bom-share__fb{--c:#1877f2!important}.bom-share__wa{--c:#1fa855!important}.bom-share__tg{--c:#229ed9!important}.bom-share__copy{--c:#8a6400!important}
.bom-share__copy.is-ok{background:#16a34a;border-color:#16a34a;color:#fff!important}
.bom-gsrc{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:#fff;border:1px solid #dadce0;color:#202124!important;font-size:14px;font-weight:600;text-decoration:none!important;box-shadow:0 1px 2px rgba(0,0,0,.08)}
.bom-gsrc:hover{box-shadow:0 2px 8px rgba(0,0,0,.15);text-decoration:none}
.bom-gsrc{justify-content:center}
.bom-gsrc__star{flex:none;color:#f4b400}
.bom-gsrc__g{flex:none;width:20px;height:20px;object-fit:contain}
.bom-gsrc b{font-weight:800}
.bom-story-people{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:-4px 0 14px;font-size:13px}
.bom-story-people>span{font-weight:800;color:var(--bom-muted)}
.bom-story-people a{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 3px;border-radius:999px;border:1px solid var(--bom-border);font-weight:700;text-decoration:none;color:var(--bom-text)}
.bom-story-people a:hover{border-color:var(--bom-brand);background:#fff8d6;text-decoration:none}
.bom-story-people .bp-ava{width:26px;height:26px;border-radius:50%;object-fit:cover}
.bom-story-people .bp-ava--txt{display:grid;place-items:center;font-style:normal;font-weight:900;color:#ffc400;background:#15130e}

/* ========== 11. Related + Trending ========== */
.bom-after{max-width:1240px;margin:36px auto 0}
.bom-more{margin-top:28px}
.bom-more__h{font-size:22px;font-weight:900;margin:0 0 14px;padding-left:12px;border-left:5px solid var(--bom-brand)}
@media (max-width:768px){.bom-meta-box{padding:12px;flex-wrap:wrap}.bom-meta-box__actions{width:100%;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center}.bom-gsrc{font-size:13px;padding:8px 12px}.bom-share__lbl{display:none}}

/* ========== 12. Compact story list ========== */
.bom-list{display:grid;gap:10px}
@media (min-width:760px){.bom-list{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.bom-list{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bom-li{display:grid;grid-template-columns:112px minmax(0,1fr);gap:12px;align-items:center;padding:10px;border-radius:14px;border:1px solid var(--bom-border);background:#fff;color:var(--bom-text);text-decoration:none;transition:border-color .15s,box-shadow .15s}
.bom-li:hover{border-color:var(--bom-brand);box-shadow:0 10px 24px -16px rgba(120,80,0,.5);text-decoration:none}
.bom-li__img{display:block;width:112px;aspect-ratio:4/3;border-radius:10px;overflow:hidden;background:var(--bom-surface)}
.bom-li__img img{width:100%;height:100%;object-fit:cover}
.bom-li__body{min-width:0;display:flex;flex-direction:column;gap:3px}
.bom-li__body em{font-style:normal;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#b37a00}
.bom-li__body b{font-size:15px;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.bom-li__body small{font-size:12px;color:var(--bom-muted)}
@media (max-width:480px){.bom-li{grid-template-columns:92px minmax(0,1fr)}.bom-li__img{width:92px}.bom-li__body b{font-size:14px}}

/* ========== 13. Wider article on mobile/tablet ========== */
.bom-gsrc--img{padding:0;border:0;background:none;box-shadow:none}
.bom-gsrc--img img{display:block;height:40px;width:auto}
@media (max-width:768px){.bom-container{padding:0 12px}.bom-main{padding-top:14px}}
@media (max-width:480px){.bom-container{padding:0 10px}.bom-content{font-size:16.5px;line-height:1.7}}



/* ========== 20. Header (v0.6) ========== */
body { transition: background .2s, color .2s; }
html.hd-locked { overflow: hidden; }
.hd { position: sticky; top: 0; z-index: 100; background: var(--bom-card); border-bottom: 1px solid var(--bom-border); }
.admin-bar .hd { top: 32px; }
.hd__in { max-width: var(--bom-max); margin: 0 auto; display: flex; align-items: center; gap: 16px; padding: 10px 16px; }
.hd__logo { margin-right: 26px; }
.hd__logo { display: flex; align-items: center; gap: 10px; flex: none; color: var(--bom-text); text-decoration: none !important; }
.hd__img { max-height: 58px; width: auto; }
.hd__img--d { display: none; }
[data-theme="dark"] .hd__img--l:not(.hd__img--auto), [data-theme="dark"] .ft__img--l:not(.ft__img--auto) { display: none; }
[data-theme="dark"] .hd__img--d, [data-theme="dark"] .ft__img--d { display: block; }
[data-theme="dark"] .hd__img--auto, [data-theme="dark"] .ft__img--auto { filter: brightness(0) invert(1); }
.ft__img--d { display: none; }
.hd__mark { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; background: var(--bom-brand); color: #15130e; font: 800 20px/1 var(--bom-head); }
.hd__name { font: 800 21px/1 var(--bom-head); letter-spacing: -.02em; }
.hd__nav { flex: 1; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.hd__nav::-webkit-scrollbar { display: none; }
.hd__nav ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.hd__nav a { display: block; padding: 8px 13px; border-radius: 9px; color: var(--bom-text); font-weight: 700; font-size: 15px; white-space: nowrap; text-decoration: none !important; }
.hd__nav a:hover, .hd__nav .current-menu-item > a { background: var(--bom-surface); }
.hd__search { display: flex; align-items: center; gap: 8px; width: 340px; height: 44px; padding: 0 12px; border-radius: 10px; background: var(--bom-bg); border: 1px solid var(--bom-border); color: var(--bom-muted); }
.hd__search input { flex: 1; min-width: 0; border: 0; background: none; color: var(--bom-text); font: inherit; font-size: 14px; outline: none; }
.hd__mode { display: flex; gap: 2px; height: 40px; padding: 3px; border-radius: 99px; border: 1px solid var(--bom-border); background: var(--bom-bg); cursor: pointer; flex: none; }
.hd__mode span { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; color: var(--bom-muted); }
.hd__sun { background: var(--bom-brand); color: #15130e !important; }
[data-theme="dark"] .hd__sun { background: none; color: var(--bom-muted) !important; }
[data-theme="dark"] .hd__moon { background: var(--bom-brand); color: #15130e; }
.hd__btn { flex: none; height: 40px; display: grid; place-items: center; padding: 0 16px; border-radius: 10px; background: var(--bom-brand); color: #15130e !important; font-weight: 800; font-size: 14px; text-decoration: none !important; max-width: 150px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.hd__burger { display: flex; flex: none; width: 42px; height: 42px; border-radius: 10px; border: 1px solid var(--bom-border); background: var(--bom-bg); flex-direction: column; justify-content: center; align-items: center; gap: 4px; cursor: pointer; }
.hd__burger span { display: block; width: 18px; height: 2px; border-radius: 2px; background: var(--bom-text); transition: transform .2s, opacity .2s; }
.hd__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.hd__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.hd__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }
/* category row */
.hd__cats { max-width: var(--bom-max); margin: 0 auto; display: flex; gap: 6px; padding: 0 16px 10px; overflow-x: auto; scrollbar-width: none; }
.hd__cats::-webkit-scrollbar { display: none; }
.hd__cats a { flex: none; display: flex; align-items: center; gap: 7px; padding: 6px 12px; border-radius: 99px; color: var(--bom-muted); font-size: 13px; font-weight: 700; white-space: nowrap; text-decoration: none !important; border: 1px solid transparent; }
.hd__cats a svg { color: var(--bom-gold); }
.hd__cats a:hover { color: var(--bom-text); border-color: var(--bom-border); background: var(--bom-bg); }
.hd__live { color: var(--bom-text) !important; background: var(--bom-bg); border-color: var(--bom-border) !important; }
.hd__live i { width: 8px; height: 8px; border-radius: 50%; background: var(--bom-accent); animation: bomPulse 1.6s infinite; }
.hd__live b { font-size: 10px; letter-spacing: .08em; color: var(--bom-accent); }
@keyframes bomPulse { 50% { opacity: .3; } }
/* all-sections panel */
.hd__panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--bom-card); border-bottom: 1px solid var(--bom-border); box-shadow: 0 30px 60px -30px rgba(0,0,0,.35); max-height: calc(100vh - 70px); overflow-y: auto; }
.hd__panel[hidden] { display: none; }
.hd__pin { max-width: var(--bom-max); margin: 0 auto; padding: 18px 16px 22px; display: flex; flex-direction: column; gap: 18px; }
.hd__psearch { display: none; align-items: center; gap: 10px; height: 48px; padding: 0 14px; border-radius: 12px; background: var(--bom-bg); border: 1px solid var(--bom-border); color: var(--bom-muted); }
.hd__psearch input { flex: 1; min-width: 0; border: 0; background: none; color: var(--bom-text); font: inherit; outline: none; }
.hd__groups { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.hd__grp > b { display: block; margin: 0 0 8px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--bom-muted); }
.hd__grp > div { display: flex; flex-direction: column; gap: 2px; }
.hd__grp a { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; font-weight: 700; font-size: 14.5px; color: var(--bom-text); text-decoration: none !important; }
.hd__grp a svg { flex: none; color: var(--bom-gold); }
.hd__grp a:hover { background: var(--bom-surface); }
.hd__langs { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding-top: 14px; border-top: 1px dashed var(--bom-border); }
.hd__langs b { width: 100%; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--bom-muted); }
.hd__langs a { padding: 7px 13px; border-radius: 99px; border: 1px solid var(--bom-border); font-size: 13px; font-weight: 700; color: var(--bom-text); text-decoration: none !important; }
.hd__langs a:hover { border-color: var(--bom-brand); background: var(--bom-brand); color: #15130e; }
.hd__pfoot { display: none; gap: 10px; }
.hd__pbtn, .hd__pmode { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; height: 46px; border-radius: 12px; font: inherit; font-weight: 800; font-size: 14px; cursor: pointer; text-decoration: none !important; }
.hd__pbtn { background: var(--bom-brand); color: #15130e !important; }
.hd__pmode { background: var(--bom-bg); color: var(--bom-text); border: 1px solid var(--bom-border); }
.hd__pmode-d, [data-theme="dark"] .hd__pmode-l { display: none; }
[data-theme="dark"] .hd__pmode-d { display: inline; }
@media (max-width: 1100px) { .hd__nav { display: none; } .hd__search { flex: 1; width: auto; } .hd__logo { margin-right: 8px; } }
@media (max-width: 782px) { .admin-bar .hd { top: 46px; } }
@media (max-width: 700px) {
	.hd__in { gap: 8px; padding: 8px 12px; }
	.hd__logo { flex: 1; min-width: 0; }
	.hd__img { max-height: 42px; }
	.hd__logo { margin-right: 0; }
	.hd__search, .hd__btn { display: none; }
	.hd__cats { padding: 0 12px 8px; }
	.hd__panel { max-height: calc(100vh - 100px); }
	.hd__psearch { display: flex; }
	.hd__groups { grid-template-columns: 1fr 1fr; gap: 14px 10px; }
	.hd__grp a { padding: 10px 8px; font-size: 14px; background: var(--bom-bg); border: 1px solid var(--bom-border); margin-bottom: 6px; }
	.hd__pfoot { display: flex; }
}
@media (max-width: 380px) { .hd__groups { grid-template-columns: 1fr; } }

/* ========== 21. Footer (ticket style) ========== */
.ft { margin-top: 56px; padding: 0 0 24px; background: var(--bom-surface); border-top: 1px solid var(--bom-border); }
.ft__in { max-width: var(--bom-max); margin: 0 auto; padding: 0 16px; }
.ft a { text-decoration: none !important; }
.ft__ticket { position: relative; top: -34px; display: grid; grid-template-columns: minmax(0, 1.2fr) 22px minmax(0, 1fr); border-radius: 26px; background: #15130e; color: #f4efe2; box-shadow: 0 24px 50px -30px rgba(0,0,0,.6); }
.ft__ticket::before, .ft__ticket::after { content: ""; position: absolute; left: calc(54.5% - 1px); width: 30px; height: 30px; border-radius: 50%; background: var(--bom-surface); transform: translateX(-50%); }
.ft__ticket::before { top: -15px; background: var(--bom-bg); }
.ft__ticket::after { bottom: -15px; }
.ft__stub { padding: 30px 32px; display: flex; flex-direction: column; gap: 12px; }
.ft__logo { display: inline-flex; }
.ft__img { max-height: 76px; width: auto; }
.ft__img--l:not(.ft__img--auto) { display: none; }
.ft__img--d { display: block; }
.ft__img--auto { filter: brightness(0) invert(1); }
.ft .hd__name { color: #fff; font-size: 30px; }
.ft__stub p { margin: 0; max-width: 440px; color: #c9c1ab; font-size: 15px; }
.ft__tear { border-left: 2px dashed rgba(255,196,0,.45); margin: 22px 0; }
.ft__follow { padding: 30px 32px; display: flex; flex-direction: column; justify-content: center; gap: 12px; }
.ft__follow > b { font: 800 20px/1.1 var(--bom-head); color: var(--bom-brand); }
.ft__social { display: flex; flex-wrap: wrap; gap: 8px; }
.ft__social a { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(255,255,255,.08); color: #f4efe2; transition: background .15s, color .15s, transform .15s; }
.ft__social a:hover { background: var(--bom-brand); color: #15130e; transform: translateY(-2px); }
.ft__cta { display: flex; flex-wrap: wrap; gap: 8px; }
.ft__cta a { display: inline-flex; align-items: center; gap: 8px; height: 42px; padding: 0 16px; border-radius: 12px; font-size: 13.5px; font-weight: 800; }
.ft__gsrc { background: #fff; color: #202124 !important; }
.ft__yt { background: #e62117; color: #fff !important; }
.ft__groups { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-top: -8px; }
.ft__grp { padding: 16px; border-radius: 18px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.ft__grp > b { display: flex; align-items: center; gap: 8px; margin-bottom: 12px; font-size: 14px; font-weight: 800; color: var(--bom-text); }
.ft__grp > b svg { color: var(--bom-gold); }
.ft__grp > div { display: flex; flex-wrap: wrap; gap: 6px; }
.ft__grp a { padding: 6px 11px; border-radius: 99px; background: var(--bom-bg); border: 1px solid var(--bom-border); color: var(--bom-text); font-size: 13px; font-weight: 600; }
.ft__grp a:hover { background: var(--bom-brand); border-color: var(--bom-brand); color: #15130e; }
.ft__bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-top: 18px; padding-top: 16px; border-top: 1px dashed var(--bom-border); }
.ft__pol { display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; }
.ft__pol a { color: var(--bom-muted); font-weight: 600; }
.ft__pol a:hover { color: var(--bom-text); }
.ft__bottom p { margin: 0; font-size: 12.5px; color: var(--bom-muted); }
[data-theme="dark"] .ft__ticket { box-shadow: 0 0 0 1px var(--bom-border); }
@media (max-width: 900px) { .ft__groups { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) {
	.ft__ticket { grid-template-columns: 1fr; }
	.ft__ticket::before, .ft__ticket::after { display: none; }
	.ft__tear { border-left: 0; border-top: 2px dashed rgba(255,196,0,.45); margin: 0 22px; }
	.ft__stub, .ft__follow { padding: 22px 20px; }
	.ft__img { max-height: 60px; }
	.ft__groups { grid-template-columns: 1fr; }
}

/* ========== 22. "About our numbers" box ========== */
.bom-note { margin-top: 18px; padding: 16px 18px 18px; border-radius: 18px; background: var(--bom-bg); border: 1px dashed var(--bom-border); }
.bom-note__h { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 12px; }
.bom-note__h b { font: 800 15px/1 var(--bom-head); letter-spacing: .02em; text-transform: uppercase; color: var(--bom-muted); }
.bom-note__h a { font-size: 13px; font-weight: 800; color: var(--bom-gold) !important; text-decoration: none !important; }
.bom-note__g { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.bom-note__g > div { display: flex; gap: 10px; align-items: flex-start; }
.bom-note__g > div > span { flex: none; display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--bom-brand); color: #15130e; }
.bom-note__g b { display: block; font-size: 14px; margin-bottom: 2px; }
.bom-note__g p, .bom-note__p { margin: 0; font-size: 13px; line-height: 1.5; color: var(--bom-muted); }
@media (max-width: 760px) { .bom-note__g { grid-template-columns: 1fr; gap: 12px; } }

/* ========== 23. Homepage ========== */
html:not([data-theme="dark"]) body.home { --bom-bg: #f6f4ee; background: #f6f4ee; }
.home .bom-main { padding-top: 20px; }
.hm { display: flex; flex-direction: column; gap: 48px; }
.hm a { color: var(--bom-text); text-decoration: none !important; }
.hm img { width: 100%; height: 100%; object-fit: cover; }
.hm-ph { display: block; width: 100%; height: 100%; background: var(--bom-img); }
.hm small { color: var(--bom-muted); font-size: 13px; }
.hm-gold { color: var(--bom-gold); }
.hm-2l { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-h { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; scroll-margin-top: 130px; }
.hm-h h2 { margin: 0; font: 800 26px/1.1 var(--bom-head); letter-spacing: -.02em; }
.hm-h > a { flex: none; font-weight: 700; font-size: 14px; color: var(--bom-gold) !important; }
.hm-n { flex: none; padding: 4px 8px; border-radius: 6px; background: var(--bom-brand); color: #15130e; font: 800 13px/1 var(--bom-head); }
.hm-rule { flex: 1; height: 1px; background: var(--bom-border); }
.hm-g3, .hm-g4, .hm-g6 { display: grid; gap: 16px; }
.hm-g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hm-g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.hm-g6 { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; }
.hm-card { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.hm-card > b { font-size: 16.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-card__img { position: relative; display: block; aspect-ratio: 16/10; border-radius: 14px; overflow: hidden; background: var(--bom-img); }
.hm-card__img img { transition: transform .3s; }
.hm-card:hover .hm-card__img img { transform: scale(1.04); }
.hm-badge { position: absolute; right: 8px; top: 8px; font-style: normal; padding: 3px 8px; border-radius: 7px; background: var(--bom-brand); color: #15130e; font-size: 12px; font-weight: 800; }
/* number on the box office image */
.hm-ov { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; padding: 34px 12px 10px; background: linear-gradient(0deg, rgba(10,8,6,.88) 20%, rgba(10,8,6,0)); }
.hm-ov b { color: var(--bom-brand); font: 800 24px/1.1 var(--bom-head); }
.hm .hm-ov small { color: rgba(255,255,255,.82); font-size: 11.5px; font-weight: 600; }

/* hero */
.hm-hero { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 16px; }
.hm-slider { position: relative; border-radius: 22px; overflow: hidden; background: #15130e; min-height: 540px; }
.hm-slides { position: absolute; inset: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.hm-slides::-webkit-scrollbar { display: none; }
.hm-slide { position: relative; flex: 0 0 100%; scroll-snap-align: start; }
.hm-slide::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(10,8,6,.9) 0%, rgba(10,8,6,.55) 22%, rgba(10,8,6,0) 48%); }
.hm-slide__t { position: absolute; z-index: 1; left: 24px; right: 24px; bottom: 44px; display: flex; flex-direction: column; align-items: flex-start; gap: 8px; }
.hm-slide__t b { color: #fff; font: 800 32px/1.15 var(--bom-head); letter-spacing: -.01em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-shadow: 0 2px 12px rgba(0,0,0,.4); }
.hm .hm-slide__t small { color: rgba(255,255,255,.78); }
.hm-slide__t em { font-style: normal; padding: 3px 10px; border-radius: 99px; background: var(--bom-brand); color: #15130e; font-size: 11.5px; font-weight: 800; }
.hm-dots { position: absolute; z-index: 2; left: 24px; bottom: 18px; display: flex; gap: 6px; }
.hm-dots button { width: 8px; height: 8px; padding: 0; border: 0; border-radius: 99px; background: rgba(255,255,255,.45); cursor: pointer; transition: width .25s, background .25s; }
.hm-dots button[aria-current="true"] { width: 26px; background: var(--bom-brand); }
.hm-score { border-radius: 22px; padding: 18px; display: flex; flex-direction: column; gap: 4px; background: var(--bom-card); border: 1px solid var(--bom-border); min-width: 0; }
.hm-score__h { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.hm-score__h b { font: 800 19px/1 var(--bom-head); }
.hm-score__h span { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; color: var(--bom-accent); }
.hm-score__h span i, .hm-live__u i { width: 7px; height: 7px; border-radius: 50%; background: var(--bom-accent); animation: bomPulse 1.6s infinite; }
.hm-score > a { display: flex; flex-direction: column; gap: 3px; padding: 6px 0; }
.hm-score > a > span { display: flex; justify-content: space-between; gap: 8px; font-size: 14px; }
.hm-score > a > span b:first-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-score > a small { font-size: 11.5px; }
.hm-score i { display: block; height: 5px; border-radius: 5px; background: var(--bom-surface); font-style: normal; }
.hm-score i i { background: var(--bom-brand); }
.hm-more { margin-top: auto; font-weight: 700; font-size: 14px; color: var(--bom-gold) !important; }

/* breaking ticker */
.hm-brk { display: flex; align-items: center; gap: 0; margin-top: -30px; border-radius: 14px; overflow: hidden; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-brk > b { flex: none; display: flex; align-items: center; gap: 6px; align-self: stretch; padding: 0 14px; background: var(--bom-accent); color: #fff; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.hm-brk__m { flex: 1; min-width: 0; overflow: hidden; mask-image: linear-gradient(90deg, transparent, #000 3%, #000 97%, transparent); }
.hm-brk__t { display: flex; width: max-content; animation: bomTick 50s linear infinite; }
.hm-brk__t span { display: flex; }
.hm-brk:hover .hm-brk__t { animation-play-state: paused; }
.hm-brk a { padding: 12px 22px; font-size: 14px; font-weight: 700; white-space: nowrap; position: relative; }
.hm-brk a::before { content: ""; position: absolute; left: 0; top: 50%; width: 5px; height: 5px; margin-top: -2px; border-radius: 50%; background: var(--bom-brand); }
@keyframes bomTick { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { .hm-brk__t { animation: none; } .hm-brk__m { overflow-x: auto; } }

/* pulse numbers */
.hm-pulse { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: -24px; }
.hm-pulse > div { display: flex; flex-direction: column; gap: 2px; padding: 14px 16px; border-radius: 16px; background: var(--bom-card); border: 1px solid var(--bom-border); min-width: 0; }
.hm-pulse b { font: 800 24px/1.15 var(--bom-head); }
.hm-pulse > div:first-child { background: var(--bom-brand); border-color: var(--bom-brand); }
.hm-pulse > div:first-child * { color: #15130e !important; }
.hm-pulse small { font-weight: 700; font-size: 11.5px; text-transform: uppercase; letter-spacing: .06em; }
.hm-pulse span { font-size: 13px; color: var(--bom-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* live board */
.hm-live { padding: 22px; border-radius: 24px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-live .hm-h { margin-bottom: 4px; }
.hm-live__u { display: flex; align-items: center; gap: 8px; margin: 0 0 12px; font-size: 13px; color: var(--bom-muted); }
.hm-live__list { display: flex; flex-direction: column; }
.hm-lv { display: grid; grid-template-columns: 34px 54px minmax(0, 1fr) 96px 130px; align-items: center; gap: 14px; padding: 14px 0; border-top: 1px solid var(--bom-border); }
.hm-lv__r { font: 800 30px/1 var(--bom-head); color: transparent; -webkit-text-stroke: 1.5px var(--bom-gold); text-align: center; }
.hm-lv__p { width: 54px; height: 76px; border-radius: 9px; overflow: hidden; background: var(--bom-img); }
.hm-lv__b { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.hm-lv__n { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.hm-lv__n > a { font: 800 18px/1.2 var(--bom-head); }
.hm-lv__b > small { font-size: 12.5px; }
.hm-lv__l { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 2px; }
.hm-lv__l a { padding: 4px 10px; border-radius: 8px; border: 1px solid var(--bom-border); font-size: 12px; font-weight: 700; background: var(--bom-bg); }
.hm-lv__l a:hover { border-color: var(--bom-brand); }
.hm-lv__s { color: var(--bom-gold); }
.hm-lv__v { text-align: right; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; }
.hm-lv__v b { font: 800 22px/1.1 var(--bom-head); color: var(--bom-gold); }
.hm-lv__v small { font-size: 11.5px; }
.hm-chip { font-style: normal; padding: 2px 9px; border-radius: 99px; font-size: 11px; font-weight: 800; white-space: nowrap; }
.hm-chip--adv { background: #fff1c2; color: #7a5600; }
.hm-chip--wk { background: #dbeafe; color: #1e4fae; }
.hm-chip--run { background: #dcfce7; color: #166534; }
[data-theme="dark"] .hm-chip--adv { background: #3a2f10; color: #ffd75a; }
[data-theme="dark"] .hm-chip--wk { background: #14284d; color: #93b8ff; }
[data-theme="dark"] .hm-chip--run { background: #0f3320; color: #7ee2a2; }
.hm-ch { font-style: normal; font-size: 11.5px; font-weight: 800; }
.hm-ch--up { color: #15803d; }
.hm-ch--down { color: #c2410c; }
[data-theme="dark"] .hm-ch--up { color: #6ee7a0; }
[data-theme="dark"] .hm-ch--down { color: #fb923c; }

/* posters */
.hm-poster { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.hm-poster > b { font-size: 14.5px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-poster > b.hm-2l { white-space: normal; }
.hm-poster > small { font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-poster__img { position: relative; display: block; aspect-ratio: 2/3; border-radius: 14px; overflow: hidden; background: var(--bom-img); }
.hm-poster__img img { transition: transform .3s; }
.hm-poster:hover .hm-poster__img img { transform: scale(1.04); }
.hm-poster__tag { position: absolute; left: 8px; bottom: 8px; display: flex; align-items: center; gap: 5px; max-width: calc(100% - 16px); padding: 4px 8px; border-radius: 8px; background: rgba(15,13,10,.85); color: var(--bom-brand); font-style: normal; font-size: 11px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-poster__tag--dub { background: var(--bom-brand); color: #15130e; }
.hm-date { position: absolute; right: 8px; top: 8px; display: flex; flex-direction: column; align-items: center; padding: 4px 8px; border-radius: 8px; background: var(--bom-brand); color: #15130e; font-style: normal; font-size: 10px; font-weight: 800; line-height: 1; }
.hm-date b { font-size: 18px; }
.hm-rate { position: absolute; left: 8px; bottom: 8px; padding: 4px 9px; border-radius: 8px; background: var(--bom-brand); color: #15130e; font-style: normal; font-size: 12.5px; font-weight: 800; }

/* milestones */
.hm-ms { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hm-ms > a { display: flex; gap: 12px; align-items: center; padding: 14px; border-radius: 18px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-ms > a:hover { border-color: var(--bom-brand); }
.hm-ms__b { flex: none; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; width: 78px; height: 78px; border-radius: 50%; background: var(--bom-dark); color: var(--bom-brand); }
.hm-ms__b b { font: 800 14px/1 var(--bom-head); }
.hm-ms > a > span:last-child b { display: block; font: 800 16px/1.2 var(--bom-head); }
.hm-ms small { font-size: 12.5px; }

/* tabs */
.hm-tabbar { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 14px; }
.hm-tabbar button, .hm-seg button { height: 38px; padding: 0 16px; border-radius: 99px; border: 1px solid var(--bom-border); background: var(--bom-card); color: var(--bom-text); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.hm-tabbar button[aria-selected="true"], .hm-seg button[aria-pressed="true"] { background: var(--bom-dark); border-color: var(--bom-dark); color: var(--bom-brand); }
[data-theme="dark"] .hm-tabbar button[aria-selected="true"], [data-theme="dark"] .hm-seg button[aria-pressed="true"] { background: var(--bom-brand); color: #15130e; border-color: var(--bom-brand); }
.hm-tabmore { display: inline-block; margin-top: 12px; font-weight: 700; font-size: 14px; color: var(--bom-gold) !important; }

/* monthly ranking */
.hm-rank { padding: 22px; border-radius: 24px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-rank__bar { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.hm-seg { display: flex; gap: 4px; padding: 3px; border-radius: 99px; background: var(--bom-bg); border: 1px solid var(--bom-border); height: fit-content; }
.hm-seg button { height: 34px; border: 0; background: none; }
.hm-rank__l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; }
.hm-rank[data-m="net"] .hm-rank__l:not([data-l="net"]), .hm-rank[data-m="gross"] .hm-rank__l:not([data-l="gross"]), .hm-rank[data-m="ww"] .hm-rank__l:not([data-l="ww"]) { display: none; }
.hm-rank__l li { display: grid; grid-template-columns: 26px 40px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--bom-border); }
.hm-rank__n { font: 800 18px/1 var(--bom-head); color: var(--bom-muted); text-align: center; }
.hm-rank__l li:nth-child(-n+3) .hm-rank__n { color: var(--bom-gold); }
.hm-rank__p { width: 40px; height: 56px; border-radius: 7px; overflow: hidden; background: var(--bom-img); }
.hm-rank__b { min-width: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; }
.hm-rank__b > a { font-weight: 800; font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.hm-rank__b > small { width: 100%; font-size: 12px; }
.hm-rank__b > i { width: 100%; display: block; height: 4px; border-radius: 4px; background: var(--bom-surface); }
.hm-rank__b > i i { display: block; height: 100%; border-radius: 4px; background: var(--bom-brand); }
.hm-rank__l li > b { font: 800 17px/1 var(--bom-head); }
.hm-rank__e { grid-column: 1 / -1; display: block !important; color: var(--bom-muted); }
.hm-vd { font-style: normal; padding: 1px 8px; border-radius: 99px; font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; background: var(--bom-surface); color: var(--bom-muted); }
.hm-vd--up { background: #dcfce7; color: #166534; }
.hm-vd--down { background: #fee2e2; color: #b91c1c; }
.hm-vd--run { background: #dbeafe; color: #1e4fae; }
[data-theme="dark"] .hm-vd--up { background: #0f3320; color: #7ee2a2; }
[data-theme="dark"] .hm-vd--down { background: #3b1414; color: #fca5a5; }
[data-theme="dark"] .hm-vd--run { background: #14284d; color: #93b8ff; }

/* compare */
.hm-cmp { --ca: #d99b00; --cb: #2f6fe4; padding: 22px; border-radius: 24px; background: var(--bom-card); border: 1px solid var(--bom-border); }
[data-theme="dark"] .hm-cmp { --ca: #ffc400; --cb: #6ea2ff; }
.hm-cmp__pick { display: grid; grid-template-columns: 1fr auto 1fr; gap: 12px; align-items: end; }
.hm-cmp__in { display: flex; flex-direction: column; gap: 6px; }
.hm-cmp__in span { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.hm-cmp__in--a span { color: var(--ca); }
.hm-cmp__in--b span { color: var(--cb); }
.hm-cmp__in input { height: 46px; padding: 0 14px; border-radius: 12px; border: 2px solid var(--bom-border); background: var(--bom-bg); color: var(--bom-text); font: inherit; font-weight: 700; }
.hm-cmp__in--a input:focus { border-color: var(--ca); outline: none; }
.hm-cmp__in--b input:focus { border-color: var(--cb); outline: none; }
.hm-cmp__vs { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--bom-dark); color: var(--bom-brand); font: 800 14px/1 var(--bom-head); }
.hm-cmp__out { margin-top: 18px; }
.hm-cmp__e { margin: 0; padding: 26px; text-align: center; color: var(--bom-muted); border: 1px dashed var(--bom-border); border-radius: 14px; }
.hm-cmp__names { display: flex; justify-content: space-between; gap: 12px; font: 800 18px/1.2 var(--bom-head); margin-bottom: 8px; }
.hm-cmp__names .a { color: var(--ca); }
.hm-cmp__names .b { color: var(--cb); text-align: right; }
.hm-cmp__r { display: grid; grid-template-columns: 110px minmax(0, 1fr) 110px minmax(0, 1fr) 110px; gap: 10px; align-items: center; padding: 9px 0; border-bottom: 1px solid var(--bom-border); }
.hm-cmp__r small { text-align: center; font-weight: 700; font-size: 12.5px; }
.hm-cmp__v { font-weight: 800; font-size: 15px; }
.hm-cmp__v.b { text-align: right; }
.hm-cmp__v.win { color: var(--bom-text); }
.hm-cmp__v.win::after { content: " ●"; font-size: 9px; vertical-align: middle; }
.hm-cmp__v.a.win::after { color: var(--ca); }
.hm-cmp__v.b.win::before { content: "● "; font-size: 9px; vertical-align: middle; color: var(--cb); }
.hm-cmp__v.b.win::after { content: none; }
.hm-cmp__bar { display: flex; height: 10px; border-radius: 10px; background: var(--bom-surface); overflow: hidden; }
.hm-cmp__bar.a { justify-content: flex-end; }
.hm-cmp__bar i { display: block; height: 100%; border-radius: 10px; }
.hm-cmp__bar.a i { background: var(--ca); }
.hm-cmp__bar.b i { background: var(--cb); }
.hm-cmp__r--t { border-bottom: 0; }
.hm-cmp__chart { margin: 14px 0 0; }
.hm-cmp__chart figcaption { font-size: 13px; font-weight: 700; color: var(--bom-muted); margin-bottom: 6px; }
.hm-cmp__plot { position: relative; padding: 18px 0 0; }
.hm-cmp__y { position: absolute; left: 0; top: 0; font-size: 12px; font-weight: 700; color: var(--bom-muted); }
.hm-cmp__chart svg { display: block; width: 100%; height: 180px; overflow: visible; }
.hm-cmp__x { display: flex; justify-content: space-between; margin-top: 4px; font-size: 12px; color: var(--bom-muted); }
.hm-cmp__chart line, .hm-cmp__chart polyline { vector-effect: non-scaling-stroke; }
.hm-cmp__chart .ax { stroke: var(--bom-border); stroke-width: 1.5; }
.hm-cmp__chart .gr { stroke: var(--bom-border); stroke-dasharray: 3 4; }
.hm-cmp__chart .la, .hm-cmp__chart .lb { fill: none; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.hm-cmp__chart .la { stroke: var(--ca); }
.hm-cmp__chart .lb { stroke: var(--cb); }
.hm-cmp__leg { display: flex; gap: 18px; font-size: 13px; font-weight: 700; }
.hm-cmp__leg span::before { content: ""; display: inline-block; width: 14px; height: 4px; border-radius: 2px; margin-right: 6px; vertical-align: middle; }
.hm-cmp__leg .a::before { background: var(--ca); }
.hm-cmp__leg .b::before { background: var(--cb); }

/* trailers block */
.hm-dark { padding: 24px; border-radius: 26px; background: #15130e; }
[data-theme="dark"] .hm-dark { background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-dark .hm-h h2 { color: #f4efe2; }
.hm-dark .hm-rule { background: rgba(255,255,255,.12); }
.hm-dark .hm-h > a { color: var(--bom-brand) !important; }
.hm-vid { all: unset; display: flex; flex-direction: column; gap: 8px; cursor: pointer; min-width: 0; }
.hm-vid b { color: #f4efe2; font-size: 15px; }
.hm .hm-vid small { color: #a39b86; }
.hm-vid__img { position: relative; display: block; aspect-ratio: 16/9; border-radius: 14px; overflow: hidden; background: #2b261c; }
.hm-vid__img i { position: absolute; left: 50%; top: 50%; width: 46px; height: 46px; margin: -23px 0 0 -23px; border-radius: 50%; background: rgba(226,55,68,.95); }
.hm-vid__img i::after { content: ""; position: absolute; left: 18px; top: 14px; border-left: 14px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.hm-vid__img em { position: absolute; left: 8px; top: 8px; font-style: normal; padding: 3px 7px; border-radius: 6px; background: rgba(15,13,10,.85); color: var(--bom-brand); font-size: 10.5px; font-weight: 800; text-transform: uppercase; }
.hm-vid:focus-visible .hm-vid__img { outline: 3px solid var(--bom-brand); }
.hm-modal { position: fixed; inset: 0; z-index: 9999; display: grid; place-items: center; padding: 16px; background: rgba(10,8,6,.86); }
.hm-modal > div { position: relative; width: min(960px, 100%); }
.hm-modal iframe { display: block; width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 14px; background: #000; }
.hm-modal button { position: absolute; right: 0; top: -46px; width: 38px; height: 38px; border-radius: 50%; border: 0; background: #fff; color: #111; cursor: pointer; }

/* top cast */
.hm-cast { display: flex; gap: 18px; overflow-x: auto; padding: 4px 2px 8px; scrollbar-width: thin; }
.hm-cast > a { flex: none; width: 112px; display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
.hm-cast__img { display: grid; place-items: center; width: 104px; height: 104px; border-radius: 50%; overflow: hidden; background: var(--bom-dark); border: 3px solid var(--bom-card); box-shadow: 0 0 0 2px var(--bom-brand); }
.hm-cast__img i { font: 800 36px/1 var(--bom-head); font-style: normal; color: var(--bom-brand); }
.hm-cast > a:hover .hm-cast__img { box-shadow: 0 0 0 3px var(--bom-brand); }
.hm-cast b { font-size: 14px; line-height: 1.25; margin-top: 6px; }
.hm-cast small { font-size: 12px; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* song reviews */
.hm-rev { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.hm-rev > a { display: flex; gap: 12px; align-items: center; padding: 10px; border-radius: 16px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-rev > a:hover { border-color: var(--bom-brand); }
.hm-rev__img { position: relative; flex: none; width: 64px; height: 64px; border-radius: 50%; overflow: hidden; background: var(--bom-img); }
.hm-rev__img i { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(15,13,10,.55); color: var(--bom-brand); font: 800 17px/1 var(--bom-head); font-style: normal; }
.hm-rev b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; font-size: 14.5px; line-height: 1.35; }

/* web stories */
.hm-ws { display: flex; gap: 14px; overflow-x: auto; padding: 2px 2px 6px; scrollbar-width: thin; }
.hm-ws > a { flex: none; position: relative; width: 164px; aspect-ratio: 9/16; border-radius: 18px; overflow: hidden; background: var(--bom-img); box-shadow: 0 0 0 2px var(--bom-brand); }
.hm-ws > a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.75), rgba(0,0,0,0) 55%); }
.hm-ws__bar { position: absolute; z-index: 1; left: 10px; right: 10px; top: 10px; display: flex; gap: 3px; }
.hm-ws__bar i { flex: 1; height: 3px; border-radius: 3px; background: rgba(255,255,255,.45); }
.hm-ws__bar i:first-child { background: #fff; }
.hm-ws b { position: absolute; z-index: 1; left: 12px; right: 12px; bottom: 12px; color: #fff; font-size: 14px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

/* two columns + latest */
.hm-two { display: flex; gap: 28px; flex-wrap: wrap; }
.hm-two__a { flex: 3 1 600px; min-width: 0; }
.hm-two__b { flex: 2 1 340px; min-width: 0; }
.hm-latest__g { display: grid; grid-template-columns: 1fr 1fr; column-gap: 28px; padding: 6px 20px; border-radius: 22px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-latest__g > a { display: flex; flex-direction: column; gap: 3px; padding: 13px 0 13px 18px; border-bottom: 1px solid var(--bom-border); position: relative; }
.hm-latest__g > a::before { content: ""; position: absolute; left: 0; top: 19px; width: 8px; height: 8px; border-radius: 50%; border: 2px solid var(--bom-brand); }
.hm-latest__g > a:nth-last-child(-n+2) { border-bottom: 0; }
.hm-latest__g small { color: var(--bom-gold) !important; font-weight: 800; font-size: 11.5px !important; text-transform: uppercase; letter-spacing: .04em; }
.hm-latest__g b { font-size: 15.5px; line-height: 1.35; }
.hm-latest__g > a:hover b { color: var(--bom-gold); }
.hm-loadmore { display: grid !important; place-items: center; margin-top: 12px; height: 44px; border-radius: 12px; border: 1px solid var(--bom-border) !important; font-weight: 700; }

/* responsive */
@media (max-width: 1100px) {
	.hm-hero { grid-template-columns: minmax(0, 1fr) 300px; }
	.hm-g6 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.hm-g6 > :nth-child(n+5) { display: none; }
	.hm-rev, .hm-ms { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-lv { grid-template-columns: 30px 50px minmax(0, 1fr) 120px; }
	.hm-lv__s { display: none; }
}
@media (max-width: 900px) {
	.hm-hero { grid-template-columns: 1fr; }
	.hm-slider { min-height: 0; aspect-ratio: 16/10; }
	.hm-g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-pulse { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hm-rank__l { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
	.hm { gap: 36px; }
	.hm-h h2 { font-size: 21px; }
	.hm-slider { aspect-ratio: 4/5; border-radius: 18px; }
	.hm-slide__t { left: 16px; right: 16px; bottom: 38px; }
	.hm-slide__t b { font-size: 21px; }
	.hm-dots { left: 16px; bottom: 16px; }
	.hm-brk, .hm-pulse { margin-top: -20px; }
	.hm-pulse b { font-size: 20px; }
	.hm-g3 { grid-template-columns: 1fr; }
	.hm-g6 { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
	.hm-g6 > :nth-child(n+5) { display: flex; }
	.hm-poster > b { font-size: 13px; }
	.hm-live, .hm-rank, .hm-cmp { padding: 16px 12px; border-radius: 20px; }
	.hm-lv { grid-template-columns: 44px minmax(0, 1fr) auto; gap: 10px; }
	.hm-lv__r { display: none; }
	.hm-lv__p { width: 44px; height: 62px; }
	.hm-lv__n > a { font-size: 16px; }
	.hm-lv { align-items: start; }
	.hm-lv__v b { font-size: 17px; }
	.hm-lv__l { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-right: -60px; }
	.hm-lv__l::-webkit-scrollbar { display: none; }
	.hm-lv__l a { flex: none; padding: 3px 8px; font-size: 11.5px; }
	.hm-cmp__chart svg { height: 140px; }
	.hm-rev, .hm-ms { grid-template-columns: 1fr; }
	.hm-dark { padding: 18px 14px; border-radius: 20px; }
	.hm-cmp__pick { grid-template-columns: 1fr; }
	.hm-cmp__vs { justify-self: center; width: 38px; height: 38px; margin: -4px 0; }
	.hm-cmp__r { grid-template-columns: 1fr 1fr; gap: 4px 10px; }
	.hm-cmp__r small { grid-column: 1 / -1; order: -1; text-align: left; }
	.hm-cmp__r .hm-cmp__bar { display: none; }
	.hm-cmp__v.b { text-align: right; }
	.hm-cast > a { width: 92px; }
	.hm-cast__img { width: 86px; height: 86px; }
}


/* letter tile when a movie has no poster */
.hm-ph--l { position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; padding: 10px; text-align: center; background: linear-gradient(160deg, hsl(var(--h) 45% 32%), hsl(calc(var(--h) + 40) 50% 14%)); }
.hm-ph--l b { font: 800 clamp(26px, 4vw, 56px)/1 var(--bom-head); color: var(--bom-brand); }
.hm .hm-ph--l small { color: rgba(255,255,255,.85); font-size: 12px; font-weight: 700; line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hm-lv__p .hm-ph--l small, .hm-mbo__p .hm-ph--l small { display: none; }
.hm-lv__p .hm-ph--l b, .hm-mbo__p .hm-ph--l b { font-size: 20px; }

/* monthly box office table */
.hm-mbo { padding: 22px; border-radius: 24px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-mbo__sum { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.hm-mbo__sum > div { padding: 12px 14px; border-radius: 14px; background: var(--bom-bg); border: 1px solid var(--bom-border); }
.hm-mbo__sum small { display: block; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.hm-mbo__sum b { font: 800 22px/1.2 var(--bom-head); }
.hm-mbo__sum > div:nth-child(2) { background: var(--bom-brand); border-color: var(--bom-brand); }
.hm-mbo__sum > div:nth-child(2) * { color: #15130e !important; }
.hm-mbo__wrap { max-height: 560px; overflow: auto; border-radius: 14px; border: 1px solid var(--bom-border); }
.hm-mbo__t { width: 100%; border-collapse: collapse; font-size: 14.5px; min-width: 620px; }
.hm-mbo__t th, .hm-mbo__t td { padding: 10px 12px; text-align: right; border-bottom: 1px solid var(--bom-border); white-space: nowrap; }
.hm-mbo__t thead th { position: sticky; top: 0; z-index: 1; background: var(--bom-card); font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--bom-muted); }
.hm-mbo__t th button { all: unset; cursor: pointer; padding: 4px 8px; border-radius: 7px; font-weight: 800; }
.hm-mbo__t th button::after { content: " ↓"; opacity: 0; }
.hm-mbo__t .hm-sm { display: none; }
@media (max-width: 640px) { .hm-mbo__t .hm-sm { display: inline; } }
.hm-mbo__t th button[aria-pressed="true"] { background: var(--bom-dark); color: var(--bom-brand); }
.hm-mbo__t th button[aria-pressed="true"]::after { opacity: 1; }
[data-theme="dark"] .hm-mbo__t th button[aria-pressed="true"] { background: var(--bom-brand); color: #15130e; }
.hm-mbo__t td { font-weight: 800; font-variant-numeric: tabular-nums; font-size: 16.5px; }
.hm-mbo__t tbody tr:nth-child(-n+3) td:not(.hm-mbo__n):not(.hm-mbo__m) { color: var(--bom-gold); }
.hm-mbo__t .hm-mbo__n { width: 36px; text-align: center; color: var(--bom-muted); }
.hm-mbo__t tbody tr:nth-child(-n+3) .hm-mbo__n { color: var(--bom-gold); font-size: 16px; }
.hm-mbo__t .hm-mbo__m { text-align: left; white-space: normal; }
.hm-mbo__m > a { display: inline-flex; align-items: center; gap: 10px; vertical-align: middle; margin-right: 8px; }
.hm-mbo__p { flex: none; width: 34px; height: 48px; border-radius: 6px; overflow: hidden; background: var(--bom-img); }
.hm-mbo__m b { display: block; font-size: 14.5px; }
.hm-mbo__m small { display: block; font-size: 11.5px; font-weight: 600; }
.hm-mbo__t tbody tr:hover { background: var(--bom-bg); }
.hm-mbo__t tfoot td { position: sticky; bottom: 0; background: var(--bom-surface); border-bottom: 0; }
.hm-mbo__f { margin: 10px 0 0; font-size: 12.5px; color: var(--bom-muted); }
@media (max-width: 760px) { .hm-mbo { padding: 16px 12px; border-radius: 20px; } .hm-mbo__sum { grid-template-columns: 1fr 1fr; } .hm-mbo__sum b { font-size: 18px; } .hm-mbo__t { font-size: 13.5px; } }

/* compare suggestions */
.hm-cmp__in { position: relative; }
.hm-cmp__sug { position: absolute; z-index: 5; left: 0; right: 0; top: 100%; margin: 6px 0 0; padding: 6px; list-style: none; border-radius: 12px; background: var(--bom-card); border: 1px solid var(--bom-border); box-shadow: 0 20px 40px -20px rgba(0,0,0,.4); max-height: 300px; overflow-y: auto; }
.hm-cmp__sug li { padding: 9px 10px; border-radius: 8px; font-weight: 700; font-size: 14px; cursor: pointer; text-transform: none; letter-spacing: 0; }
.hm-cmp__sug li:hover { background: var(--bom-surface); }
.hm-cmp__sug li.none { cursor: default; color: var(--bom-muted); }


/* overlays on posters */
.hm-ov b i { font-style: normal; font-size: 14px; color: rgba(255,255,255,.75); margin-left: 2px; }
.hm-vtag { position: absolute; left: 8px; top: 8px; z-index: 1; }
.hm-vtag .hm-vd { display: inline-block; font-size: 11px; padding: 3px 9px; box-shadow: 0 2px 8px rgba(0,0,0,.25); }

/* predict the opening */
.hm-pred { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 24px; align-items: center; padding: 22px; border-radius: 24px; background: radial-gradient(120% 140% at 100% 0%, rgba(255,196,0,.28), transparent 55%), #15130e; color: #f4efe2; }
.hm-pred__p { aspect-ratio: 2/3; border-radius: 14px; overflow: hidden; background: #2b271f; transform: rotate(-3deg); box-shadow: 0 18px 30px -12px rgba(0,0,0,.6); }
.hm-pred__k { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 99px; background: var(--bom-brand); color: #15130e !important; font-weight: 800; font-size: 11.5px !important; text-transform: uppercase; letter-spacing: .06em; }
.hm-pred h2 { margin: 10px 0 6px; font: 800 26px/1.15 var(--bom-head); color: #fff; }
.hm-pred h2 em { font-style: normal; color: var(--bom-brand); }
.hm-pred p { margin: 0 0 14px; color: #c9c1ab; font-size: 14px; }
.hm-pred__o { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.hm-pred__o button { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; padding: 12px 14px; border-radius: 14px; border: 1.5px solid rgba(255,255,255,.16); background: rgba(255,255,255,.05); color: #f4efe2; font: inherit; font-weight: 800; font-size: 15px; cursor: pointer; text-align: left; transition: border-color .15s, transform .15s; }
.hm-pred__o button:hover { border-color: var(--bom-brand); transform: translateY(-2px); }
.hm-pred__o button > i { display: none; width: 100%; height: 6px; border-radius: 6px; background: rgba(255,255,255,.1); }
.hm-pred__o button > i i { display: block; height: 100%; width: 0; border-radius: 6px; background: var(--bom-brand); transition: width .6s; }
.hm-pred__o button > b { font: 800 20px/1 var(--bom-head); color: var(--bom-brand); }
.hm-pred.is-voted .hm-pred__o button { cursor: default; transform: none; }
.hm-pred.is-voted .hm-pred__o button > i { display: block; }
.hm-pred__o button[aria-pressed="true"] { border-color: var(--bom-brand); background: rgba(255,196,0,.12); }
.hm-pred__n { display: block; margin-top: 10px; color: #a39b86 !important; font-size: 12.5px !important; }

/* on this day */
.hm-otd { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.hm-otd > a { position: relative; display: grid; grid-template-columns: 64px minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px; border-radius: 18px; background: var(--bom-card); border: 1px solid var(--bom-border); overflow: hidden; }
.hm-otd > a:hover { border-color: var(--bom-brand); }
.hm-otd__y { position: absolute; right: 12px; top: 10px; display: flex; align-items: baseline; gap: 3px; font-size: 11px; font-weight: 800; color: var(--bom-muted); text-transform: uppercase; }
.hm-otd__y b { font: 800 22px/1 var(--bom-head); color: var(--bom-gold); }
.hm-otd__p { width: 64px; height: 90px; border-radius: 10px; overflow: hidden; background: var(--bom-img); }
.hm-otd__p .hm-ph--l small { display: none; }
.hm-otd__t { display: flex; flex-direction: column; gap: 2px; min-width: 0; padding-right: 40px; }
.hm-otd__t b { font: 800 16px/1.2 var(--bom-head); }
.hm-otd__t small { font-size: 12px; }
.hm-otd__t em { margin-top: 4px; font-style: normal; font-weight: 800; font-size: 15px; color: var(--bom-gold); }
.hm-otd__t em i { font-style: normal; font-size: 11px; color: var(--bom-muted); font-weight: 700; }
@media (max-width: 1100px) { .hm-otd { grid-template-columns: 1fr 1fr; } .hm-pred__o { grid-template-columns: 1fr 1fr; } }

/* ---------- mobile polish ---------- */
@media (max-width: 480px) { .hm-row { margin-left: -10px !important; margin-right: -10px !important; padding-left: 10px !important; padding-right: 10px !important; } .hm-dark .hm-row { margin: 0 -14px !important; padding: 0 14px 4px !important; } }
@media (max-width: 600px) { .admin-bar .hd { top: 0; } }
@media (max-width: 640px) {
	.hm-row { display: flex !important; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; margin: 0 -12px; padding: 0 12px 4px; }
	.hm-row::-webkit-scrollbar { display: none; }
	.hm-row > * { flex: 0 0 40%; scroll-snap-align: start; display: flex !important; }
	.hm-row--wide > * { flex-basis: 78%; }
	.hm-dark .hm-row { margin: 0 -14px; padding: 0 14px 4px; }
	.hm-slider { aspect-ratio: 16/12; }
	.hm-slide__t { bottom: 34px; gap: 6px; }
	.hm-slide__t b { font-size: 18px; }
	.hm-slide__t small { font-size: 12px; }
	.hm-cmp__pick { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; }
	.hm-cmp__in span { font-size: 10.5px; }
	.hm-cmp__in input { height: 42px; padding: 0 10px; font-size: 14px; }
	.hm-cmp__vs { width: 32px; height: 32px; margin: 0 0 5px; font-size: 11px; align-self: end; }
	.hm-mbo__t { min-width: 0; font-size: 13px; }
	.hm-mbo__t th, .hm-mbo__t td { padding: 10px 3px; }
	.hm-mbo__t .hm-mbo__n { display: none; }
	.hm-mbo__t .hm-lg { display: none; }
	.hm-mbo__t th button::after { content: none; }
	.hm-mbo__t td:not(.hm-mbo__m) { white-space: nowrap; }
	.hm-mbo__t { table-layout: fixed; }
	.hm-mbo__t .hm-mbo__m { width: 40%; overflow-wrap: anywhere; }
	.hm-mbo__m .hm-vd { display: inline-block; margin-top: 3px; }
	.hm-mbo__m small { display: none; }
	.hm-mbo__t td:not(.hm-mbo__m) { font-size: 13px; letter-spacing: -.01em; }
	.hm-mbo__t thead th { font-size: 10px; letter-spacing: 0; }
	.hm-mbo__t th button { padding: 3px 5px; white-space: normal; }
	.hm-mbo__p { display: none; }
	.hm-mbo__m > a { margin-right: 0; display: block; }
	.hm-mbo__m b { font-size: 13px; }
	.hm-mbo__m .hm-vd { font-size: 9px; padding: 0 6px; }
	.hm-mbo__wrap { max-height: 480px; }
	.hm-news { grid-template-columns: 1fr 1fr !important; gap: 12px; }
	.hm-news .hm-card > b { font-size: 14.5px; -webkit-line-clamp: 3; }
	.hm-news .hm-card > small { font-size: 11.5px; }
	.hm-latest__g { grid-template-columns: 1fr; padding: 4px 14px; }
	.hm-tabbar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
	.hm-tabbar button { flex: none; height: 36px; padding: 0 14px; font-size: 13.5px; }
	.hm-latest__g > a:nth-last-child(2) { border-bottom: 1px solid var(--bom-border); }
	.hm-pred h2 { font-size: 19px; }
	.hm-pred p { font-size: 13px; }
	.hm-pred { align-items: start; }
	.hm-pred__o { gap: 8px; }
	.hm-pred__o button { padding: 10px; font-size: 13px; }
	.hm-otd { grid-template-columns: 1fr; }
}


/* compare: link to full page */
.hm-cmp__full { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 16px; height: 48px; border-radius: 14px; background: var(--bom-dark); color: var(--bom-brand) !important; font-weight: 800; font-size: 14.5px; text-align: center; padding: 0 12px; }
[data-theme="dark"] .hm-cmp__full { background: var(--bom-brand); color: #15130e !important; }
.hm-cmp__full:hover { filter: brightness(1.1); }
.hm-ov__s { font-size: 16px !important; }

/* latest song lyrics — record sleeves */
.hm-lyr__row { display: flex; gap: 22px; overflow-x: auto; padding: 4px 4px 10px; scrollbar-width: thin; }
.hm-lyr__c { flex: none; width: 172px; display: flex; flex-direction: column; gap: 6px; }
.hm-lyr__art { position: relative; display: block; width: 150px; height: 150px; }
.hm-lyr__cover { position: relative; z-index: 1; display: block; width: 150px; height: 150px; border-radius: 12px; overflow: hidden; background: var(--bom-img); box-shadow: 0 12px 24px -12px rgba(0,0,0,.5); }
.hm-lyr__disc { position: absolute; top: 6px; left: 12px; width: 138px; height: 138px; border-radius: 50%; background: radial-gradient(circle, var(--bom-brand) 0 13%, #111 14% 16%, #1c1c1c 17% 30%, #111 31% 33%, #222 34% 48%, #111 49% 51%, #1b1b1b 52% 100%); transition: transform .4s; }
.hm-lyr__c:hover .hm-lyr__disc { transform: translateX(28px) rotate(120deg); }
.hm-lyr__c b { font-size: 14.5px; line-height: 1.3; margin-top: 4px; }
.hm .hm-lyr__c small { display: flex; align-items: center; gap: 5px; color: var(--bom-gold); font-weight: 800; font-size: 12.5px; }

/* menu: connect with us */
.hd__connect { padding-top: 14px; border-top: 1px dashed var(--bom-border); }
.hd__connect > b { display: block; margin-bottom: 10px; font-size: 11px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--bom-muted); }
.hd__connect > div { display: flex; flex-wrap: wrap; gap: 8px; }
.hd__connect a { display: flex; align-items: center; gap: 8px; padding: 8px 14px 8px 8px; border-radius: 99px; background: var(--bom-bg); border: 1px solid var(--bom-border); color: var(--bom-text) !important; font-weight: 700; font-size: 13.5px; text-decoration: none !important; transition: background .15s, color .15s; }
.hd__connect a svg { width: 30px; height: 30px; padding: 6px; border-radius: 50%; background: var(--c); color: #fff; }
.hd__connect a:hover { background: var(--c); border-color: var(--c); color: #fff !important; }

/* live search suggestions */
.hd__search, .hd__psearch, .sr__form { position: relative; }
.hd__sug { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 120; max-height: 70vh; overflow-y: auto; padding: 8px; border-radius: 14px; background: var(--bom-card); border: 1px solid var(--bom-border); box-shadow: 0 24px 48px -20px rgba(0,0,0,.45); min-width: 300px; }
.hd__sug > b { display: block; padding: 6px 8px 4px; font-size: 10.5px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--bom-muted); }
.hd__sug a { display: flex; align-items: center; gap: 10px; padding: 7px 8px; border-radius: 10px; color: var(--bom-text) !important; text-decoration: none !important; }
.hd__sug a:hover { background: var(--bom-surface); }
.hd__sug a img, .hd__sug a i { flex: none; width: 40px; height: 40px; border-radius: 8px; object-fit: cover; background: var(--bom-img); display: grid; place-items: center; font-style: normal; font-weight: 800; color: var(--bom-gold); }
.hd__sug a.m img, .hd__sug a.m i { width: 34px; height: 50px; }
.hd__sug a span { min-width: 0; display: flex; flex-direction: column; }
.hd__sug strong { font-size: 13.5px; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hd__sug small { font-size: 11.5px; color: var(--bom-muted); }
.hd__sug a.all { justify-content: center; margin-top: 4px; font-weight: 800; font-size: 13px; color: var(--bom-gold) !important; background: var(--bom-bg); }
.hd__sug p { margin: 0; padding: 10px; font-size: 13px; color: var(--bom-muted); }

/* search results page */
.sr { max-width: 1100px; margin: 0 auto; }
.sr__form { display: flex; align-items: center; gap: 10px; height: 56px; padding: 0 8px 0 16px; border-radius: 16px; background: var(--bom-card); border: 2px solid var(--bom-border); color: var(--bom-muted); }
.sr__form:focus-within { border-color: var(--bom-brand); }
.sr__form input { flex: 1; min-width: 0; border: 0; background: none; color: var(--bom-text); font: inherit; font-size: 17px; font-weight: 600; outline: none; }
.sr__form button { height: 42px; padding: 0 20px; border: 0; border-radius: 11px; background: var(--bom-brand); color: #15130e; font: inherit; font-weight: 800; cursor: pointer; }
.sr__h { margin: 22px 0 2px; font: 800 30px/1.15 var(--bom-head); }
.sr__c { margin: 0 0 8px; color: var(--bom-muted); font-size: 14px; }
.sr__sec { margin-top: 26px; }
.sr__sec > h2 { font: 800 21px/1 var(--bom-head); margin: 0 0 14px; padding-left: 10px; border-left: 4px solid var(--bom-brand); }
.sr__movies { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 14px; }
.sr__mv { display: flex; flex-direction: column; gap: 5px; color: var(--bom-text); text-decoration: none !important; min-width: 0; }
.sr__poster { position: relative; display: block; aspect-ratio: 2/3; border-radius: 14px; overflow: hidden; background: var(--bom-img); }
.sr__poster img { width: 100%; height: 100%; object-fit: cover; }
.sr__poster em { position: absolute; left: 8px; bottom: 8px; padding: 3px 8px; border-radius: 7px; background: var(--bom-brand); color: #15130e; font-style: normal; font-size: 12px; font-weight: 800; }
.sr__mv b { font-size: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.sr__mv small, .sr__post small { color: var(--bom-muted); font-size: 12.5px; }
.sr .hm-ph--l small { color: rgba(255,255,255,.85); font-size: 12px; font-weight: 700; }
.sr__people { display: flex; gap: 16px; overflow-x: auto; padding-bottom: 6px; }
.sr__people a { flex: none; width: 96px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; color: var(--bom-text); text-decoration: none !important; font-size: 13.5px; }
.sr__people span { display: grid; place-items: center; width: 84px; height: 84px; border-radius: 50%; overflow: hidden; background: var(--bom-dark); box-shadow: 0 0 0 2px var(--bom-brand); }
.sr__people img { width: 100%; height: 100%; object-fit: cover; }
.sr__people i { font: 800 30px/1 var(--bom-head); font-style: normal; color: var(--bom-brand); }
.sr__posts { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sr__post { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 14px; align-items: center; padding: 10px; border-radius: 16px; background: var(--bom-card); border: 1px solid var(--bom-border); color: var(--bom-text); text-decoration: none !important; }
.sr__post:hover { border-color: var(--bom-brand); }
.sr__img { display: block; aspect-ratio: 16/10; border-radius: 10px; overflow: hidden; background: var(--bom-img); }
.sr__img img { width: 100%; height: 100%; object-fit: cover; }
.sr__txt { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.sr__txt em { font-style: normal; font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: var(--bom-gold); }
.sr__txt b { font-size: 15.5px; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.sr__none { color: var(--bom-muted); }
@media (max-width: 900px) { .sr__movies { grid-template-columns: repeat(3, minmax(0, 1fr)); } .sr__posts { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .sr__movies { display: flex; overflow-x: auto; } .sr__mv { flex: 0 0 40%; } .sr__post { grid-template-columns: 112px minmax(0, 1fr); } .sr__h { font-size: 23px; } .sr__form button { padding: 0 14px; } }

/* compare page */
.cp { --ca: #d99b00; --cb: #2f6fe4; max-width: 1040px; margin: 0 auto; }
[data-theme="dark"] .cp { --ca: #ffc400; --cb: #6ea2ff; }
.cp__head { text-align: center; padding: 10px 0 20px; }
.cp__k { display: inline-flex; align-items: center; gap: 6px; padding: 4px 12px; border-radius: 99px; background: var(--bom-brand); color: #15130e; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.cp__head h1 { margin: 12px 0 6px; font: 800 clamp(28px, 5vw, 44px)/1.05 var(--bom-head); }
.cp__head p { margin: 0 auto; max-width: 620px; color: var(--bom-muted); }
.cp__pick { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 12px; align-items: end; padding: 18px; border-radius: 22px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.cp__in { position: relative; display: flex; flex-direction: column; gap: 6px; }
.cp__in span { font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.cp__in--a span { color: var(--ca); }
.cp__in--b span { color: var(--cb); }
.cp__in input { height: 52px; padding: 0 14px; border-radius: 14px; border: 2px solid var(--bom-border); background: var(--bom-bg); color: var(--bom-text); font: inherit; font-weight: 800; font-size: 16px; }
.cp__in--a input:focus { border-color: var(--ca); outline: none; }
.cp__in--b input:focus { border-color: var(--cb); outline: none; }
.cp__swap { width: 46px; height: 46px; margin-bottom: 3px; border-radius: 50%; border: 0; background: var(--bom-dark); color: var(--bom-brand); cursor: pointer; display: grid; place-items: center; }
.cp__out { margin-top: 20px; }
.cp__score { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; padding: 18px 22px; border-radius: 22px; background: #15130e; color: #fff; }
.cp__score > div { display: flex; align-items: center; gap: 14px; min-width: 0; }
.cp__score .b { justify-content: flex-end; text-align: right; }
.cp__score b { font: 800 20px/1.15 var(--bom-head); }
.cp__score .a b { color: var(--ca); }
.cp__score .b b { color: var(--cb); }
.cp__score span { font: 800 44px/1 var(--bom-head); }
.cp__vs { display: flex; flex-direction: column; align-items: center; gap: 4px; font: 800 18px/1 var(--bom-head); color: var(--bom-brand); }
.cp__vs small { font: 700 11.5px/1.2 var(--bom-font); color: #c9c1ab; text-transform: uppercase; letter-spacing: .06em; white-space: nowrap; }
.cp__tbl, .cp__days { margin-top: 14px; border-radius: 18px; border: 1px solid var(--bom-border); background: var(--bom-card); overflow: hidden; }
.cp table { width: 100%; border-collapse: collapse; }
.cp__tbl td, .cp__tbl th { padding: 13px 16px; border-bottom: 1px solid var(--bom-border); }
.cp__tbl th { text-align: center; font-size: 13px; color: var(--bom-muted); font-weight: 700; width: 30%; }
.cp__tbl td { font-weight: 800; font-size: 16.5px; width: 35%; }
.cp__tbl td.b { text-align: right; }
.cp__tbl td i { display: inline-block; margin: 0 6px; padding: 1px 7px; border-radius: 99px; font-style: normal; font-size: 11px; background: #dcfce7; color: #166534; vertical-align: middle; }
[data-theme="dark"] .cp__tbl td i { background: #0f3320; color: #7ee2a2; }
.cp td.a.win { color: var(--ca); }
.cp td.b.win { color: var(--cb); }
.cp__tbl tr:last-child td, .cp__tbl tr:last-child th { border-bottom: 0; }
.cp__chart { margin-top: 18px; padding: 16px; border-radius: 18px; border: 1px solid var(--bom-border); background: var(--bom-card); }
.cp__h2 { margin: 26px 0 0; font: 800 22px/1 var(--bom-head); }
.cp__days { max-height: 520px; overflow: auto; }
.cp__days th, .cp__days td { padding: 9px 12px; border-bottom: 1px solid var(--bom-border); text-align: right; font-size: 14px; white-space: nowrap; }
.cp__days thead th { position: sticky; top: 0; background: var(--bom-surface); font-size: 12px; text-transform: uppercase; letter-spacing: .04em; }
.cp__days thead th.a { color: var(--ca); }
.cp__days thead th.b { color: var(--cb); }
.cp__days tbody th { text-align: left; color: var(--bom-muted); }
.cp__days td { font-weight: 800; }
.cp__days .cp__ca, .cp__days .cp__cb { color: var(--bom-muted); font-weight: 600; }
.cp__share { display: block; margin: 18px auto 0; height: 46px; padding: 0 22px; border-radius: 12px; border: 0; background: var(--bom-brand); color: #15130e; font: inherit; font-weight: 800; cursor: pointer; }
.cp .bom-note { margin-top: 26px; }
@media (max-width: 640px) {
	.cp__pick { padding: 12px; gap: 8px; }
	.cp__in input { height: 44px; font-size: 14px; padding: 0 10px; }
	.cp__swap { width: 36px; height: 36px; }
	.cp__score { padding: 14px; }
	.cp__score b { font-size: 14px; }
	.cp__score span { font-size: 30px; }
	.cp__score > div { flex-direction: column; gap: 4px; align-items: flex-start; }
	.cp__score .b { align-items: flex-end; flex-direction: column-reverse; }
	.cp__tbl td, .cp__tbl th { padding: 10px 8px; }
	.cp__tbl td { font-size: 13.5px; }
	.cp__tbl th { font-size: 11.5px; }
	.cp__tbl td i { display: none; }
	.cp__days th, .cp__days td { font-size: 12.5px; padding: 8px 6px; }
	.cp__days .cp__ca, .cp__days .cp__cb, .cp__days thead th:nth-child(n+4) { display: none; }
}

/* phone: bigger poster in "Predict", centred footer logo */
@media (max-width: 640px) {
	.hm-pred { grid-template-columns: 1fr; text-align: center; padding: 20px 16px; }
	.hm-pred__p { width: 160px; margin: 0 auto 4px; }
	.hm-pred__o { text-align: left; }
	.hm-pred__b { display: flex; flex-direction: column; align-items: center; }
	.hm-pred__o { width: 100%; }
}
@media (max-width: 700px) {
	.ft__stub { align-items: center; text-align: center; }
	.ft__stub p { margin: 0 auto; }
	.ft__img { max-height: 84px; }
	.ft__logo { justify-content: center; }
	.ft__follow { align-items: center; text-align: center; }
	.ft__social, .ft__cta { justify-content: center; }
	.ft__bottom { flex-direction: column; text-align: center; }
	.ft__pol { justify-content: center; }
}


/* monthly table: numbers right-aligned with room, totals lined up */
.hm-mbo__t { table-layout: fixed; }
.hm-mbo__t .hm-mbo__n { width: 48px; }
.hm-mbo__t th:nth-child(n+3), .hm-mbo__t td:nth-child(n+3) { width: 17%; text-align: right; padding-right: 22px; }
.hm-mbo__t th:nth-child(n+3) button { margin-right: -8px; }
.hm-mbo__t tfoot td { font-size: 17px; }
@media (max-width: 640px) {
	.hm-mbo__t .hm-mbo__n { display: none; width: 0; }
	.hm-mbo__t .hm-mbo__m { width: auto; }
	.hm-mbo__t th:nth-child(n+3), .hm-mbo__t td:nth-child(n+3) { width: 22%; padding-right: 6px; }
	.hm-mbo__t th:nth-child(n+3) button { margin-right: -4px; }
	.hm-mbo__t tfoot td { font-size: 13px; }
}

/* mobile: search bar always visible under the logo */
@media (max-width: 700px) {
	.hd__in { flex-wrap: wrap; }
	.hd__search { display: flex !important; order: 10; flex: 1 1 100%; width: auto; height: 42px; }
	.hd__search input { font-size: 16px; }
}

/* predict: any number of answers + result */
.hm-pred__o { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); }
.hm-pred__o button.is-right { border-color: #22c55e; background: rgba(34,197,94,.14); }
.hm-pred__o button.is-right > b { color: #4ade80; }
.hm-pred.is-closed .hm-pred__o button { cursor: default; }
@media (max-width: 1100px) { .hm-pred__o { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 640px) { .hm-pred__o { grid-template-columns: 1fr 1fr; } .hm-pred__o button:last-child:nth-child(odd) { grid-column: 1 / -1; } }


/* ---------- mobile header: menu left · logo centre · search + mode right ---------- */
.hd__sbtn { display: none; }
@media (max-width: 700px) {
	.hd__in { display: grid; grid-template-columns: 44px 1fr auto auto; align-items: center; gap: 6px; padding: 8px 10px; }
	.hd__burger { order: -1; grid-column: 1; grid-row: 1; width: 42px; height: 42px; border: 0; background: none; }
	.hd__logo { grid-column: 2; grid-row: 1; justify-content: center; margin: 0; min-width: 0; }
	.hd__img { max-height: 52px; max-width: 100%; }
	.hd__name { font-size: 22px; }
	.hd__sbtn { display: grid; place-items: center; grid-column: 3; grid-row: 1; width: 40px; height: 40px; border: 0; border-radius: 10px; background: none; color: var(--bom-text); cursor: pointer; }
	.hd__mode { grid-column: 4; grid-row: 1; height: 40px; padding: 0; border: 0; background: none; }
	.hd__mode span { width: 36px; height: 36px; }
	.hd__moon, [data-theme="dark"] .hd__sun { display: none !important; }
	[data-theme="dark"] .hd__moon { display: grid !important; }
	.hd__search { display: none !important; grid-column: 1 / -1; grid-row: 2; }
	.hd.hd--s .hd__search { display: flex !important; }
	.hd.hd--s .hd__sbtn { background: var(--bom-brand); color: #15130e; }
}

/* song review: film / album line */
.hm-rev__alb { display: flex; align-items: center; gap: 5px; margin: 3px 0 1px; font-style: normal; font-size: 12px; font-weight: 800; color: var(--bom-gold); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-rev__alb svg { flex: none; }

/* daily quiz */
.hm-quiz { padding: 24px; border-radius: 24px; background: var(--bom-card); border: 1px solid var(--bom-border); }
.hm-quiz__h { position: relative; }
.hm-quiz__h h2 { margin: 10px 0 4px; font: 800 26px/1.15 var(--bom-head); }
.hm-quiz__h p { margin: 0; color: var(--bom-muted); font-size: 14px; }
.hm-quiz__st { position: absolute; right: 0; top: 0; padding: 5px 12px; border-radius: 99px; background: var(--bom-bg); border: 1px solid var(--bom-border); font-size: 12.5px; font-weight: 800; }
.hm-quiz__clues { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 16px 0; padding: 0; }
.hm-quiz__clues li { padding: 14px; border-radius: 14px; background: #15130e; color: #fff; animation: bomPop .35s; }
.hm-quiz__clues li small { display: block; color: #c9c1ab !important; font-size: 11px !important; font-weight: 800; text-transform: uppercase; letter-spacing: .05em; }
.hm-quiz__clues li b { font: 800 22px/1.2 var(--bom-head); color: var(--bom-brand); }
.hm-quiz__clues li[hidden] { display: none; }
@keyframes bomPop { from { transform: scale(.9); opacity: 0; } }
.hm-quiz__o { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.hm-quiz__o button { min-height: 52px; padding: 8px 12px; border-radius: 14px; border: 2px solid var(--bom-border); background: var(--bom-bg); color: var(--bom-text); font: inherit; font-weight: 800; font-size: 14.5px; cursor: pointer; transition: border-color .15s, transform .15s; }
.hm-quiz__o button:hover:not(:disabled) { border-color: var(--bom-brand); transform: translateY(-2px); }
.hm-quiz__o button:disabled { cursor: default; opacity: .55; }
.hm-quiz__o button.is-ok { opacity: 1; border-color: #22c55e; background: rgba(34,197,94,.14); }
.hm-quiz__o button.is-bad { border-color: #ef4444; background: rgba(239,68,68,.1); }
.hm-quiz__r { display: flex; gap: 16px; align-items: center; margin-top: 16px; padding: 14px; border-radius: 16px; background: var(--bom-bg); border: 1px dashed var(--bom-border); }
.hm-quiz__r[hidden] { display: none; }
.hm-quiz__p { flex: none; width: 64px; height: 92px; border-radius: 10px; overflow: hidden; background: var(--bom-img); }
.hm-quiz__p .hm-ph--l small { display: none; }
.hm-quiz__msg { font: 800 20px/1.2 var(--bom-head); }
.hm-quiz__r p { margin: 4px 0; font-size: 14px; }
.hm-quiz__r a { color: var(--bom-gold) !important; font-weight: 800; }
@media (max-width: 760px) {
	.hm-quiz { padding: 16px; }
	.hm-quiz__h h2 { font-size: 20px; }
	.hm-quiz__st { position: static; display: inline-block; margin-top: 8px; }
	.hm-quiz__clues, .hm-quiz__o { grid-template-columns: 1fr 1fr; }
	.hm-quiz__clues li b { font-size: 18px; }
}

/* ========== 24. Dark mode for the rest of the theme ========== */
[data-theme="dark"] .bom-card, [data-theme="dark"] .bom-meta-box { background: var(--bom-card); border-color: var(--bom-border); }
[data-theme="dark"] .bom-share a, [data-theme="dark"] .bom-share button { background: var(--bom-card); border-color: var(--bom-border); color: var(--bom-text) !important; }
[data-theme="dark"] .bom-content a { color: var(--bom-brand); }

/* ========== 25. Dark mode: box office widget ========== */
[data-theme="dark"] .bx { --paper:#1b1914; --cream:#221f18; --cream2:#2a261d; --line:#2e2a22; --line2:#3a3428; --ink:#f4efe2; --ink2:#d3cab4; --muted:#a39b86; --gold-dd:#ffc400; box-shadow:none; }
[data-theme="dark"] .bx-cmp input,
[data-theme="dark"] .bx-cmp__list,
[data-theme="dark"] .bx-cmp__card,
[data-theme="dark"] .bx-cmp__lead,
[data-theme="dark"] .bx-cmp__cell,
[data-theme="dark"] .bx-pred__item,
[data-theme="dark"] .bx-table,
[data-theme="dark"] .bx-table tbody tr,
[data-theme="dark"] .bx-tl.is-next .bx-tl__dot,
[data-theme="dark"] .bx-pchip,
[data-theme="dark"] .bx-watch,
[data-theme="dark"] .bx-watch .bx-count--mini .bx-count__row span,
[data-theme="dark"] .bx-person,
[data-theme="dark"] .bx-meter em { background:#1b1914 !important; color:var(--bom-text); border-color:#3a3428; }
[data-theme="dark"] .bx-meter,
[data-theme="dark"] .bx-inbar,
[data-theme="dark"] .bx-occ,
[data-theme="dark"] .bx-mini--week,
[data-theme="dark"] .bx-role,
[data-theme="dark"] .bx-ott--na { background:#2a261d !important; }
[data-theme="dark"] .bx-today,
[data-theme="dark"] .bx-budget--deep,
[data-theme="dark"] .bx-pred,
[data-theme="dark"] .bx-map,
[data-theme="dark"] .bx-map__panel,
[data-theme="dark"] .bx-fact,
[data-theme="dark"] .bx-cal__cell.is-empty { background:#221f18 !important; }
[data-theme="dark"] .bx-table tbody tr:hover,
[data-theme="dark"] .bx-cmp__list li.is-hl,
[data-theme="dark"] .bx-cmp__list li:hover,
[data-theme="dark"] .bx-state:hover,
[data-theme="dark"] .bx-state.is-active,
[data-theme="dark"] .bx-pchip:hover { background:#2e2817 !important; }
[data-theme="dark"] .bx-table tr.is-current,
[data-theme="dark"] .bx-table tr.is-current:hover,
[data-theme="dark"] .bx tr.is-flash td { background:#3a2f10 !important; }
[data-theme="dark"] .bx-table td, [data-theme="dark"] .bx-table th { border-color:#2e2a22 !important; color:var(--bom-text); }
[data-theme="dark"] .bx-lv1 { background:#2a2516 !important; color:#f4efe2; }
[data-theme="dark"] .bx-lv2 { background:#4a3c12 !important; color:#f4efe2; }
[data-theme="dark"] .bx-lv3 { background:#7a5f0e !important; color:#f4efe2; }
[data-theme="dark"] .bx-lv4, [data-theme="dark"] .bx-lv5, [data-theme="dark"] .bx-stub--hero, [data-theme="dark"] .bx-cta, [data-theme="dark"] .bx-stub--hero b { color:#15130e !important; }
[data-theme="dark"] .bx-tl.is-next::before { background:linear-gradient(90deg,var(--gold),#3a3428) !important; }
[data-theme="dark"] .bx-cmp input::placeholder { color:#8d8677; }
[data-theme="dark"] .bx-ottlogo, [data-theme="dark"] .bx-watch__logo .bx-ottlogo { background:#fff !important; }

[data-theme="dark"] .bx-langs button:not(.is-on), [data-theme="dark"] .bx-cal__cell:not([class*="bx-lv"]) { background:#1b1914; border-color:#3a3428; color:var(--bom-text); }
[data-theme="dark"] .bx-langs button.is-on { background:var(--bom-brand) !important; color:#15130e !important; }
[data-theme="dark"] .bx-seg button.is-on { background:var(--bom-brand); color:#15130e; }
[data-theme="dark"] .bx-table tr.bx-tr-total td, [data-theme="dark"] .bx-table tr.bx-tr-total td:first-child { background:#0f0e0b !important; color:var(--bom-brand) !important; }
[data-theme="dark"] .bx-table th:first-child { background:#2a261d !important; }
[data-theme="dark"] .bx-table tr.bx-tr-week td { background:#221f18 !important; }
[data-theme="dark"] .bx-cal__cell.is-empty { background:repeating-linear-gradient(135deg,#1f1c15 0 6px,#1b1914 6px 12px) !important; }
[data-theme="dark"] .bx-lv4 *, [data-theme="dark"] .bx-lv5 * { color:#15130e !important; }
[data-theme="dark"] .bx-cal__cell.is-current { outline-color:#fff; }
[data-theme="dark"] .bx-col.is-current em { color:#15130e; }

/* footer ticket: no round notches */
.ft__ticket::before, .ft__ticket::after { display: none !important; }

/* ---------- fixes: related stories dark, mobile sizes ---------- */
[data-theme="dark"] .bom-li { background: var(--bom-card); border-color: var(--bom-border); color: var(--bom-text); }
[data-theme="dark"] .bom-li__body b { color: var(--bom-text); }
[data-theme="dark"] .bom-li__body em { color: var(--bom-brand); }
[data-theme="dark"] .bom-story-people a { color: var(--bom-text); }
[data-theme="dark"] .bom-story-people a:hover { background: var(--bom-surface); }
.hm-lv__p { display: block; flex: none; min-width: 54px; }
.hm-lv__p img, .hm-lv__p .hm-ph { width: 100% !important; height: 100% !important; object-fit: cover; }
@media (max-width: 640px) {
	.hm-ov { padding: 26px 10px 8px; }
	.hm-ov b { font-size: 18px; }
	.hm .hm-ov small { font-size: 10.5px; }
	.hm-lv__p { width: 50px !important; min-width: 50px; height: 72px !important; }
	.hm-lv { grid-template-columns: 50px minmax(0, 1fr) auto; }
}
@media (max-width: 700px) {
	.hd__img { max-height: 62px; }
	.hd__name { font-size: 24px; }
}
/* song review: keep text inside the card */
.hm-rev > a { min-width: 0; overflow: hidden; }
.hm-rev > a > span:last-child { flex: 1; min-width: 0; }
.hm-rev__alb { max-width: 100%; }

/* broken image → neutral tile */
img.is-broken { opacity: 0; }
img { color: transparent; }

/* ========== 26. Dark mode: movie page, people, releases, trailers (plugins) ========== */
[data-theme="dark"] .bp, [data-theme="dark"] .bmx, [data-theme="dark"] .bmx-head, [data-theme="dark"] .bmx-arch, [data-theme="dark"] .bmx-modal, [data-theme="dark"] .bh, [data-theme="dark"] .tp {
	--ink: #f4efe2; --ink2: #d3cab4; --muted: #a39b86; --line: #2e2a22; --cream: #221f18; --gold-dd: #ffc400; color: var(--bom-text);
}
[data-theme="dark"] .bp-hero,
[data-theme="dark"] .bp-soc,
[data-theme="dark"] .bp-pop div,
[data-theme="dark"] .bp-card,
[data-theme="dark"] .bp-bar,
[data-theme="dark"] .bp-rel__c,
[data-theme="dark"] .bp-nc,
[data-theme="dark"] .bp-nc__img,
[data-theme="dark"] .bmx-song,
[data-theme="dark"] .bmx-sec,
[data-theme="dark"] .bmx-seas button,
[data-theme="dark"] .bmx-plat,
[data-theme="dark"] .bmx-modal__card,
[data-theme="dark"] .bh-langs,
[data-theme="dark"] .bh-search,
[data-theme="dark"] .bh-mic,
[data-theme="dark"] .bh-genre,
[data-theme="dark"] .bh-tile,
[data-theme="dark"] .bh-tile--cinema,
[data-theme="dark"] .bt,
[data-theme="dark"] .bt__plat,
[data-theme="dark"] .bt__fol,
[data-theme="dark"] .bt__like,
[data-theme="dark"] .bh-res__h button,
[data-theme="dark"] .tp-langs,
[data-theme="dark"] .tp-types button,
[data-theme="dark"] .tp-search,
[data-theme="dark"] .tp-sel,
[data-theme="dark"] .tc,
[data-theme="dark"] .tc__rel { background-color: var(--bom-card) !important; background-image: none !important; color: var(--bom-text); }
[data-theme="dark"] .bp-ava,
[data-theme="dark"] .bp-ava--txt,
[data-theme="dark"] .bp-hero__photo,
[data-theme="dark"] .bp-soc:hover,
[data-theme="dark"] .bp-soc:focus-visible,
[data-theme="dark"] .bp-follow__btn,
[data-theme="dark"] .bp-pop a,
[data-theme="dark"] .bp-ribbon,
[data-theme="dark"] .bp-ring b,
[data-theme="dark"] .bp-seg button.is-on,
[data-theme="dark"] .bp-ledger__img,
[data-theme="dark"] .bp-up__img,
[data-theme="dark"] .bp-up__left,
[data-theme="dark"] .bp-club__top,
[data-theme="dark"] .bmx-seas button.is-on,
[data-theme="dark"] .bmx-song__n,
[data-theme="dark"] .bmx-btn,
[data-theme="dark"] .bmx-modal__card a,
[data-theme="dark"] .bh-tile--all,
[data-theme="dark"] .bt__btn,
[data-theme="dark"] .bh-more,
[data-theme="dark"] .tp-more { background-color: #0f0e0b !important; }
[data-theme="dark"] .bp-bday { color: var(--bom-text) !important; }
[data-theme="dark"] .bp-up__item,
[data-theme="dark"] .bp-rel__ph .bp-ava,
[data-theme="dark"] .bp-pages .page-numbers,
[data-theme="dark"] .bmx-song,
[data-theme="dark"] .bp-filmhead .bmx-like { border-color: var(--bom-border) !important; }
[data-theme="dark"] .bp-follow__btn { color: var(--bom-brand) !important; }
[data-theme="dark"] .bmx-plat, [data-theme="dark"] .bt__plat { color: var(--bom-text) !important; }
[data-theme="dark"] .bh-langs a.is-on, [data-theme="dark"] .tp-langs a.is-on, [data-theme="dark"] .bmx-seas button.is-on { background: var(--bom-brand) !important; color: #15130e !important; border-color: var(--bom-brand) !important; }
[data-theme="dark"] .bom-content, [data-theme="dark"] .bom-content p, [data-theme="dark"] .bom-content li, [data-theme="dark"] .bom-content h2, [data-theme="dark"] .bom-content h3 { color: var(--bom-text); }
[data-theme="dark"] .bom-content table td, [data-theme="dark"] .bom-content table th { background: var(--bom-card); color: var(--bom-text); border-color: var(--bom-border); }
[data-theme="dark"] .bom-content blockquote { border-color: var(--bom-brand); color: var(--bom-muted); }
[data-theme="dark"] .twitter-tweet, [data-theme="dark"] iframe[src*="twitter"], [data-theme="dark"] iframe[src*="platform.x.com"] { color-scheme: light; }

/* homepage: advance booking live cards */
.hm-abl .abc { margin: 0; }
.hm-abl--2 { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 900px) { .hm-abl--2 { grid-template-columns: 1fr; } }

/* ---------- Homepage: Box Office year widget (right of Live Now) ---------- */
.hm-duo { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 18px; align-items: start; }
.hm-duo--solo { grid-template-columns: 1fr; }
.hm-duo > .hm-live { min-width: 0; }
.hm-yw { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: 24px; color: #f4efe2; background: linear-gradient(150deg, rgba(255,196,0,.2), transparent 50%), #15130e; border: 1px solid rgba(255,196,0,.35); }
.hm-yw a { color: inherit; text-decoration: none; }
.hm-yw__h { display: flex; flex-direction: column; gap: 4px; }
.hm-yw__h small { display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; color: #ffc400; }
.hm-yw__h b { font: 800 22px/1.1 var(--bom-head); color: #fff; }
.hm-yw__h span { font-size: 12px; color: #c9c1ab; }
.hm-yw__h:hover b { color: #ffc400; }
.hm-yw__l { list-style: none; margin: 2px 0 0; padding: 0; display: flex; flex-direction: column; }
.hm-yw__l a { display: flex; align-items: center; gap: 10px; padding: 7px 0; border-top: 1px solid rgba(255,255,255,.07); }
.hm-yw__l li:first-child a { border-top: 0; }
.hm-yw__r { flex: none; width: 22px; height: 22px; border-radius: 7px; display: grid; place-items: center; font: 800 11.5px var(--bom-head); background: rgba(255,255,255,.08); color: #f4efe2; }
.hm-yw__l li:nth-child(-n+3) .hm-yw__r { background: #ffc400; color: #15130e; }
.hm-yw__b { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.hm-yw__b b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.hm-yw__b i { display: block; height: 4px; border-radius: 4px; background: rgba(255,255,255,.08); font-style: normal; }
.hm-yw__b i i { background: linear-gradient(90deg, #c58f00, #ffc400); }
.hm-yw__v { flex: none; font: 800 13px var(--bom-head); color: #ffc400; }
.hm-yw__l a:hover .hm-yw__b b { color: #ffc400; }
.hm-yw__c { display: flex; flex-wrap: wrap; gap: 6px; }
.hm-yw__c a { padding: 5px 10px; border-radius: 99px; font-size: 12px; font-weight: 700; border: 1px solid rgba(255,255,255,.16); }
.hm-yw__c a:hover { border-color: #ffc400; color: #ffc400; }
.hm-yw__cta { display: block; text-align: center; padding: 12px; border-radius: 14px; background: #ffc400; color: #15130e !important; font: 800 14.5px var(--bom-head); }
.hm-yw__cta:hover { background: #ffd84d; }
.hm-yw__alt { text-align: center; font-size: 12.5px; font-weight: 700; color: #c9c1ab !important; }
.hm-yw__alt:hover { color: #ffc400 !important; }
@media (max-width: 1000px) { .hm-duo { grid-template-columns: 1fr; } .hm-yw { position: static; } }

/* Homepage: X Review section badge */
.hm-badge--x { display: inline-flex; align-items: center; gap: 5px; background: #111 !important; color: #fff !important; }

/* Header: Cinemas near me button */
.hd__cine{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;height:42px;padding:0 15px;border-radius:99px;border:1.5px solid #ffc400;background:rgba(255,196,0,.12);color:var(--bom-text)!important;text-decoration:none!important;white-space:nowrap;position:relative;transition:background .15s}
.hd__cine svg{color:#e0a800}.hd__cine:hover{background:#ffc400;color:#15130e!important}.hd__cine:hover svg{color:#15130e}
.hd__cine::after{content:"";position:absolute;top:6px;right:8px;width:7px;height:7px;border-radius:50%;background:#e11d48;box-shadow:0 0 0 2px var(--bom-bg);animation:sdB 1.4s infinite}
@keyframes sdB{50%{opacity:.25}}
.hd__cine-t{font-weight:800;font-size:13.5px}
@media (max-width:1000px){.hd__cine{width:42px;padding:0}.hd__cine-t{display:none}}
@media (max-width:700px){.hd__in .hd__cine{display:none!important}}
@media (min-width:701px){.hd__cinechip{display:none!important}}
.hd__cinechip{color:#ffc400!important}

/* Header: no main nav in row 1 → bigger search */
.hd__search{flex:1 1 auto;width:auto;max-width:640px;margin:0 auto}
.hd__mlink{color:var(--bom-text)!important}

/* Header: account dropdown */
.hd__me{position:relative;flex:none}
.hd__me>summary{list-style:none;display:inline-flex;align-items:center;gap:8px;cursor:pointer;user-select:none}
.hd__me>summary::-webkit-details-marker{display:none}
.hd__me-ava{width:26px;height:26px;border-radius:50%;object-fit:cover}
.hd__me[open]>summary svg{transform:rotate(180deg)}
.hd__menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;width:240px;padding:6px;border-radius:16px;background:var(--bom-card);border:1px solid var(--bom-border);box-shadow:0 24px 48px -18px rgba(0,0,0,.55)}
.hd__menu-h{display:flex;align-items:center;gap:10px;padding:8px 10px 10px;border-bottom:1px solid var(--bom-border);margin-bottom:4px}
.hd__menu-h img{width:40px;height:40px;border-radius:50%}
.hd__menu-h span{min-width:0}.hd__menu-h b{display:block;font-size:14px}.hd__menu-h small{display:block;font-size:12px;color:var(--bom-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hd__menu a{display:block;padding:9px 12px;border-radius:10px;font-weight:700;font-size:14px;color:var(--bom-text)!important;text-decoration:none!important}
.hd__menu a:hover{background:var(--bom-surface)}
.hd__menu a.hd__menu-out{color:#e11d48!important;border-top:1px solid var(--bom-border);border-radius:0 0 10px 10px;margin-top:4px}
@media (max-width:1200px){.hd__cine-t{font-size:13px}}
@media (max-width:1150px){.hd__cine{width:42px;padding:0}.hd__cine-t{display:none}}

.hd__signin-i{display:none}
/* ---------- Mobile header: logo left · cinemas · search · mode · profile · menu ---------- */
@media (max-width:700px){
	.hd__in{display:grid!important;grid-template-columns:minmax(0,1fr) repeat(5,auto);align-items:center;gap:2px;padding:8px 10px}
	.hd__logo{grid-column:1;grid-row:1;justify-content:flex-start!important;margin:0}
	.hd__img{max-height:40px;max-width:100%}
	.hd__in .hd__cine{display:inline-flex!important;grid-column:2;grid-row:1;width:38px;height:38px;padding:0;border-width:1.5px}
	.hd__cine::after{top:3px;right:3px}
	.hd__sbtn{grid-column:3!important;grid-row:1;width:38px!important;height:38px!important}
	.hd__mode{grid-column:4!important;grid-row:1}
	.hd__me,.hd__signin{grid-column:5;grid-row:1}
	.hd__me>summary.hd__btn,.hd__in .hd__signin{display:inline-flex!important;align-items:center;justify-content:center;width:38px;height:38px;padding:0!important;border-radius:50%;background:none!important;border:0;min-width:0}
	.hd__me>summary span,.hd__me>summary>svg,.hd__signin span{display:none}
	.hd__me-ava{width:34px;height:34px;border:2px solid #ffc400}
	.hd__signin-i{display:block;color:var(--bom-text)}
	.hd__burger{grid-column:6!important;grid-row:1;order:0!important;width:38px!important;height:38px!important}
	.hd__menu{position:fixed;left:10px;right:10px;top:62px;width:auto}
	.hd__cats .hd__cinechip{display:none!important}
}
@media (max-width:360px){.hd__in{gap:0}.hd__img{max-height:34px}}

/* Mobile header v2: cinemas + mode left · logo centre (bigger) · search + profile + menu right */
@media (max-width:700px){
	.hd__in{grid-template-columns:38px 38px 38px minmax(0,1fr) 38px 38px 38px!important;gap:2px;padding:6px 8px}
	.hd__in .hd__cine{grid-column:1!important}
	.hd__mode{grid-column:2!important;justify-self:start}
	.hd__logo{grid-column:4!important;justify-content:center!important;justify-self:center}
	.hd__img{height:60px!important;max-height:60px!important;width:auto!important;max-width:100%!important;object-fit:contain}
	.hd__logo{width:100%;min-width:0}
	.hd__name{font-size:24px}
	.hd__sbtn{grid-column:5!important}
	.hd__me,.hd__signin{grid-column:6!important}
	.hd__burger{grid-column:7!important}
}
@media (max-width:360px){.hd__in{grid-template-columns:34px 34px 0 minmax(0,1fr) 34px 34px 34px!important}.hd__img{max-height:44px!important}}
@media (max-width:700px){.hd__in{grid-template-columns:38px 46px 30px minmax(0,1fr) 38px 38px 38px!important}.hd__mode{justify-self:end!important}}
@media (max-width:360px){.hd__in{grid-template-columns:34px 40px 0 minmax(0,1fr) 34px 34px 34px!important}}
/* ==========================================================================
   Article lists — bullets & numbers inside the article text only
   (direct children of .bom-content, so widgets like the box office tracker keep their own look)
   ========================================================================== */
.bom-content > ul:not([class]), .bom-content > ul.wp-block-list,
.bom-content > ol:not([class]), .bom-content > ol.wp-block-list,
.bom-content blockquote ul, .bom-content blockquote ol,
.bom-content > div:not([class*="bx"]):not([class*="ab"]) > ul:not([class]),
.bom-content > div:not([class*="bx"]):not([class*="ab"]) > ol:not([class]) {
	margin: 1em 0 1.2em !important;
	padding-left: 1.5em !important;
}
.bom-content > ul:not([class]), .bom-content > ul.wp-block-list,
.bom-content blockquote ul,
.bom-content > div:not([class*="bx"]):not([class*="ab"]) > ul:not([class]) { list-style: disc outside !important; }
.bom-content > ol:not([class]), .bom-content > ol.wp-block-list,
.bom-content blockquote ol,
.bom-content > div:not([class*="bx"]):not([class*="ab"]) > ol:not([class]) { list-style: decimal outside !important; }
.bom-content > ul ul, .bom-content > ol ul { list-style: circle outside !important; margin: .4em 0 !important; padding-left: 1.4em !important; }
.bom-content > ul:not([class]) > li, .bom-content > ul.wp-block-list > li,
.bom-content > ol:not([class]) > li, .bom-content > ol.wp-block-list > li,
.bom-content blockquote li { display: list-item !important; margin: .4em 0; padding-left: .2em; line-height: 1.65; }
.bom-content > ul > li::marker, .bom-content > ol > li::marker { color: var(--bom-gold); font-weight: 800; }
@media (max-width: 480px) {
	.bom-content > ul:not([class]), .bom-content > ul.wp-block-list,
	.bom-content > ol:not([class]), .bom-content > ol.wp-block-list { padding-left: 1.25em !important; }
}