:root{
  --bg:#0a0a0d; --elev:#121318; --card:#181a22; --fg:#f6f7fa; --dim:#b7bac6;
  --brand:#f2b300; --accent:#ff3b3b; --border:#2a2d39; --radius:18px; --shadow:0 18px 48px rgba(0,0,0,.55);
}
html,body{background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,'Helvetica Neue',Arial,sans-serif;line-height:1.55}
a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}
.container{width:min(1180px,92vw);margin:0 auto}
svg,img{max-width:100%;height:auto}
.topbar{background:#000;border-bottom:1px solid var(--border)}
.topbar .wrap{display:flex;gap:16px;align-items:center;justify-content:space-between;padding:8px 0}
.brand{display:flex;gap:12px;align-items:center}
.logo-ph, .custom-logo{width:36px;height:36px;border-radius:8px;background:#111;display:inline-grid;place-items:center;color:var(--brand);font-weight:900}
.site-title{font-weight:900;letter-spacing:.4px}
.topnav ul.menu{list-style:none;display:flex;gap:24px;margin:0;padding:0;justify-content:flex-end;align-items:center}
.topnav ul.menu li{list-style:none}
.topnav ul.menu li a{color:var(--fg)}
.header-image{border-bottom:1px solid var(--border);background:#0e0f14}
.header-image .wrap{padding:0}
.header-image .inner{aspect-ratio: 1920 / 360; width:100%; background:#0e0f14; display:block}
.header-image .inner img{display:block;width:100%;height:auto;object-fit:cover}
.hero{position:relative;border-bottom:1px solid var(--border);overflow:hidden}
.hero .bg{position:absolute;inset:0;background:radial-gradient(1200px 240px at 30% 0%, rgba(255,122,0,.18), transparent 45%), #09090c}
.hero .bg::after{content:"";position:absolute;inset:0;background:var(--hero-img, none);background-size:cover;background-position:center;opacity:.22;mix-blend:screen}
.hero .inner{position:relative;z-index:2;padding:48px 0}
.hero h1{font-size:clamp(28px,4vw,48px);margin:0 0 8px 0}
.hero .by{color:var(--dim)}
.main{display:grid;grid-template-columns:1fr;gap:22px;margin:22px 0}
@media(min-width:980px){ .main{grid-template-columns:1.2fr .8fr;} }
.media-card{background:var(--card);border:1px solid var(--border);border-radius:16px;overflow:hidden;box-shadow:var(--shadow)}
.media-card .nv-embed{aspect-ratio:16/9;background:#000}
.media-card .body{padding:12px}
.sidebar{background:var(--elev);border:1px solid var(--border);border-radius:16px;padding:18px;box-shadow:var(--shadow)}
.sidebar h2{color:#ff6d00;margin-bottom:8px}
.entry{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px}
.hotbar{background:#0e0f14;border-top:1px solid var(--border);border-bottom:1px solid var(--border);margin-top:36px}
.hotbar .wrap{display:grid;grid-template-columns:1fr;gap:10px;padding:14px 0}
@media(min-width:960px){ .hotbar .wrap{grid-template-columns: 280px 1fr;} }
.hotbar .search{display:flex;gap:8px;align-items:center}
.hotbar input[type=search]{width:100%;padding:10px;border-radius:10px;border:1px solid var(--border);background:#0d0f16;color:#fff}
.hotbar .hint{color:var(--dim);font-size:.9rem}
#nv-hotmap{height:260px;border:1px solid var(--border);border-radius:14px;overflow:hidden}
.footer{background:var(--elev);border-top:1px solid var(--border)}
.footer .wrap{padding:18px 0;color:var(--dim);display:flex;gap:18px;align-items:center;justify-content:space-between}
