/* =========================================================
   Crimson Pulse - Runtime CSS
   ========================================================= */

*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{
  margin:0; padding:0;
  background:var(--bg); color:var(--text);
  font:15px/1.65 Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,"Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ---------- Policy & Static Pages ---------- */
.cp-policy-shell{width:100%;padding:clamp(2rem,5vw,5rem) 1rem}
.cp-policy-card{width:100%;max-width:920px;margin:0 auto;padding:clamp(1.25rem,4vw,3rem);background:var(--panel);border:1px solid var(--line);border-radius:12px}
.cp-policy-tab{display:inline-block;margin:0 0 1rem;padding:.4rem .65rem;color:var(--text-on-theme);background:var(--brand);border-radius:8px;font-size:.72rem;font-weight:800;letter-spacing:.1em}
.cp-policy-card h1{margin:0 0 2rem;font-size:clamp(2.25rem,6vw,4.5rem);line-height:1}
.cp-policy-card h2{margin:2.2rem 0 .7rem;padding-bottom:.5rem;color:var(--brand);border-bottom:1px solid var(--line);font-size:1.05rem;text-transform:uppercase}
.cp-policy-card p,.cp-policy-card li{color:var(--muted);line-height:1.8}
.cp-policy-card a{color:var(--brand-2);font-weight:700;text-decoration:underline}
.cp-policy-meta{font-size:.76rem;letter-spacing:.08em}
.cp-policy-note{margin:1.5rem 0;padding:1rem;background:var(--panel-2);border-left:4px solid var(--brand-2)}
.cp-policy-form{width:100%;max-width:720px;margin:2rem auto 0;padding:clamp(1rem,3vw,1.75rem);background:var(--panel-2);border:1px solid var(--line);border-radius:12px}
.cp-policy-form fieldset{margin:0;padding:0;border:0}
.cp-policy-form legend{margin-bottom:1.2rem;color:var(--text);font-weight:800}
.cp-form-grid{display:grid;gap:1rem}
.cp-policy-field{display:grid;gap:.4rem}
.cp-policy-field label{color:var(--text);font-size:.78rem;font-weight:700}
.cp-policy-field input,.cp-policy-field textarea,.cp-policy-field select{width:100%;min-height:46px;padding:.75rem;color:var(--text);background-color:var(--panel);border:1px solid var(--line);border-radius:10px;font:inherit}
.cp-policy-field textarea{min-height:150px;resize:vertical}
.cp-policy-field select{appearance:none;padding-right:2.8rem;background-image:linear-gradient(45deg,transparent 50%,var(--brand-2) 50%),linear-gradient(135deg,var(--brand-2) 50%,transparent 50%);background-position:calc(100% - 14px) 20px,calc(100% - 9px) 20px;background-size:5px 5px,5px 5px;background-repeat:no-repeat}
.cp-policy-check{display:flex;gap:.7rem;align-items:flex-start;color:var(--muted);font-size:.84rem}
.cp-policy-check input{margin-top:.25rem;accent-color:var(--brand)}
.cp-policy-submit{min-height:46px;margin-top:1.2rem;padding:.75rem 1rem;color:var(--text-on-theme);background:var(--brand);border:1px solid var(--brand);border-radius:10px;font-weight:800;cursor:pointer}
.cp-policy-status{min-height:1.5rem;margin:.75rem 0 0;color:var(--muted)!important;font-size:.82rem}
.cp-policy-table-wrap{margin:1.5rem 0;overflow-x:auto;border:1px solid var(--line);border-radius:12px}
.cp-policy-table{width:100%;min-width:680px;border-collapse:collapse}
.cp-policy-table caption{padding:.8rem;color:var(--text-on-theme);background:var(--brand);text-align:left;font-weight:800}
.cp-policy-table th,.cp-policy-table td{padding:.75rem;border:1px solid var(--line);text-align:left}
.cp-policy-table thead,.cp-policy-table tfoot{background:var(--panel-2);font-weight:700}
@media(min-width:680px){
  .cp-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cp-field-wide{grid-column:1/-1}
}

/* ---------- Containers ---------- */
.container{max-width:1360px;margin:0 auto;padding:0 18px}

/* ---------- Masthead ---------- */
.masthead{
  position:sticky;top:0;z-index:60;
  background:var(--cp-runtime-rgba-32-0-0-95);
  backdrop-filter:saturate(115%) blur(8px);
  border-bottom:1px solid var(--line);
}
.mast-row{
  display:grid;grid-template-columns:44px 1fr 44px;
  align-items:center;gap:8px;
  padding:10px 14px;min-height:60px;
}
.icon-btn{
  display:inline-grid;place-items:center;
  width:40px;height:40px;
  border-radius:10px;
  border:1px solid var(--cp-runtime-6a1515);
  background:var(--cp-runtime-3f0000);
  color:var(--cp-runtime-ffd3d3);
  font-weight:900;cursor:pointer;
}
.brand{justify-self:center;display:flex;align-items:center;justify-content:center;min-height:40px}
.brand-logo{
  height:32px;width:auto;object-fit:contain;
  image-rendering:auto;-webkit-user-drag:none;user-select:none;
  filter:drop-shadow(0 2px 8px var(--shadow));
}
.actions{justify-self:end;display:flex;gap:8px}
.desktop-only{display:none}

.search-drop{
  display:none;
  border-top:1px solid var(--line);
  background:var(--panel-2);
  padding:10px 14px;
}
.search-form{display:flex;gap:8px}
.search-form input{
  flex:1;
  background:var(--cp-runtime-3f0000);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:12px;
  color:var(--text);
  padding:11px 12px;outline:none;
}
.search-form input::placeholder,
.top-search input::placeholder {
  color: var(--muted);
  opacity: 0.8;
}
.brand-text {
  transition: opacity 0.2s ease;
}
.brand:hover .brand-text {
  opacity: 0.85;
}
.crp-suggest-box, .crimson-pulse-suggest-box {
  scrollbar-width: thin;
  scrollbar-color: var(--cp-runtime-6a1515) var(--cp-runtime-3a0000);
}
.crp-suggest-box::-webkit-scrollbar,
.crimson-pulse-suggest-box::-webkit-scrollbar {
  width: 6px;
}
.crp-suggest-box::-webkit-scrollbar-track,
.crimson-pulse-suggest-box::-webkit-scrollbar-track {
  background: var(--cp-runtime-3a0000);
  border-radius: 0 0 12px 0;
}
.crp-suggest-box::-webkit-scrollbar-thumb,
.crimson-pulse-suggest-box::-webkit-scrollbar-thumb {
  background: var(--cp-runtime-6a1515);
  border-radius: 6px;
}
.btn{
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  color:var(--text-on-theme);
  padding:10px 14px;
  border-radius:12px;
  font-weight:800;
  border:0;cursor:pointer;
  transition:transform .12s ease, filter .22s ease;
}
.btn:hover{filter:brightness(1.05)}
.btn:active{transform:translateY(1px)}
.btn-small{padding:9px 12px;border-radius:10px}

/* ---------- Tabbar Navigation ---------- */
.tabbar{
  border-top:1px solid var(--cp-runtime-1b0000);
  border-bottom:1px solid var(--line);
  background:var(--cp-runtime-3a0000);
}
.tabbar-scroll{
  display:flex;gap:10px;overflow-x:auto;overflow-y:hidden;
  padding:10px 14px;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.tabbar-scroll::-webkit-scrollbar{display:none}
.tabbar-scroll a{
  padding:8px 14px;
  border-radius:999px;
  background:var(--cp-runtime-400000);
  border:1px solid var(--cp-runtime-6a1515);
  color:var(--cp-runtime-ffdede);
  white-space:nowrap;
  font-weight:800;
  flex-shrink:0;
}
.tabbar-scroll a.active, .tabbar-scroll a:hover{background:var(--accent);border-color:var(--cp-runtime-8a1515)}
.tabbar-scroll a.more-btn{background:transparent;border:1px dashed var(--cp-runtime-6a1515);color:var(--muted)}

/* ---------- Ticker Bar ---------- */
.ticker-bar{
  border-top:1px solid var(--cp-runtime-1b0000);
  border-bottom:1px solid var(--line);
  background:var(--cp-runtime-2a0000);
  overflow:hidden;
}
.ticker-inner{
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 14px;
  font-size:13px;
}
.ticker-label{
  font-size:11px;
  font-weight:800;
  color:var(--cp-runtime-ffc857);
  padding:3px 9px;
  border-radius:999px;
  background:var(--cp-runtime-4a0000);
  flex-shrink:0;
}
.ticker-viewport{
  overflow:hidden;
  flex:1;
}
.ticker-track{
  display:inline-flex;
  white-space:nowrap;
  will-change:transform;
}
.ticker-text{
  margin-right:48px;
  color:var(--cp-runtime-ffe0e0);
}
.ticker-url{
  color:var(--cp-runtime-ffb3b3);
  font-weight:700;
}

/* ---------- Drawer (Mobile Nav) ---------- */
.drawer{
  position:fixed;inset:0 30% 0 0;
  background:var(--cp-runtime-260000);
  border-right:1px solid var(--cp-runtime-6a1515);
  transform:translateX(-102%);
  transition:transform .28s ease;
  z-index:80;
  display:flex;flex-direction:column;
}
.drawer.open{transform:translateX(0)}
.drawer-hd{
  padding:14px;
  border-bottom:1px solid var(--cp-runtime-6a1515);
  display:flex;justify-content:space-between;align-items:center;
}
.drawer-body{padding:12px;overflow:auto}
.drawer a{
  display:block;
  background:var(--cp-runtime-3a0000);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:12px;
  padding:10px 12px;
  margin-bottom:10px;
  color:var(--cp-runtime-ffe0e0);
}
.scrim{
  position:fixed;inset:0;
  background:var(--cp-runtime-rgba-0-0-0-45);
  opacity:0;pointer-events:none;
  transition:opacity .28s ease;
  z-index:70;
}
.scrim.show{opacity:1;pointer-events:auto}

@media(min-width:980px){
  .mast-row{grid-template-columns:220px 1fr;min-height:68px}
  .desktop-only{display:flex}
  .brand{justify-self:center}
  .brand-logo{height:42px}
  .icon-btn{display:none}
  .search-drop{display:none!important}
  .top-search{display:flex;gap:10px}
  .top-search input{
    flex:1;
    background:var(--cp-runtime-3f0000);
    border:1px solid var(--cp-runtime-6a1515);
    border-radius:12px;
    color:var(--text);
    padding:11px 12px;outline:none;
  }
  .actions{display:none}
  .tabbar-scroll{padding-left:18px;padding-right:18px}
}

/* ---------- Layout & Sections ---------- */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:22px;margin-top:16px}
@media(max-width:1100px){.layout{grid-template-columns:1fr}}
.main{min-width:0}
.section-title{font-weight:900;margin:10px 0 12px;font-size:clamp(16px,2.1vw,19px)}
.subhead{color:var(--muted);margin:2px 0 12px}

/* ---------- Hero ---------- */
.hero{
  position:relative;border-radius:16px;overflow:hidden;
  background:var(--cp-runtime-200000);
  box-shadow:0 10px 26px var(--cp-runtime-rgba-0-0-0-7);
  margin:0 0 16px;
  border:1px solid var(--cp-runtime-rgba-255-255-255-08);
  aspect-ratio: 16 / 9;
}
.hero .bg{
  position:absolute;inset:0;
  background:var(--cp-runtime-000000) center/cover no-repeat;
  filter:brightness(.96) saturate(1.02);
  transform:scale(1.02);
  transition:transform .6s ease;
}
.hero:hover .bg{ transform:scale(1.06); }
.hero .shade{
  position:absolute;inset:0;
  background:linear-gradient(180deg, var(--cp-runtime-rgba-0-0-0-25) 0%, var(--cp-runtime-rgba-0-0-0-10) 38%, var(--cp-runtime-rgba-0-0-0-75) 72%, var(--cp-runtime-rgba-0-0-0-9) 100%);
  z-index:1;
}
.hero .content{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:18px 18px 16px;
  display:flex;justify-content:flex-start;align-items:flex-end;
}
.hero .meta{max-width:min(620px,92%);display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.hero h1{
  margin:0 0 2px 0;
  font-size:clamp(18px,2.1vw,24px);
  line-height:1.25;
  text-shadow:0 2px 14px var(--cp-runtime-rgba-0-0-0-85),0 0 1px var(--cp-runtime-rgba-0-0-0-7);
  letter-spacing:.2px;
}
.hero .chips{display:flex;gap:8px;flex-wrap:wrap}
.chip{
  background:var(--cp-runtime-rgba-0-0-0-45);
  border:1px solid var(--cp-runtime-rgba-255-255-255-24);
  color:var(--text-on-theme);
  font-weight:800;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
}

/* ---------- CTA Button ---------- */
.btn-cta{
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  width: auto; min-width: unset; padding: 8px 14px 8px 12px;
  border-radius: 14px; font-size: 14px; font-weight: 800; letter-spacing: .2px; color: var(--text-on-theme);
  border: 1px solid var(--cp-runtime-rgba-255-255-255-28);
  background: linear-gradient(135deg, var(--cp-runtime-rgba-255-91-91-45), var(--cp-runtime-rgba-255-154-60-5));
  backdrop-filter: blur(6px) saturate(120%); -webkit-backdrop-filter: blur(6px) saturate(120%);
  box-shadow: 0 6px 16px var(--shadow), 0 0 0 0 var(--cp-runtime-rgba-255-154-60-0);
  transition: transform .15s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
  overflow: hidden;
}
.btn-cta::after{ content:"›"; font-size:16px; line-height:1; transform: translateX(0); transition: transform .2s ease, opacity .2s ease; opacity: .9; }
.btn-cta::before{
  content:""; position:absolute; inset:0;
  background: linear-gradient(120deg, transparent 0%, var(--cp-runtime-rgba-255-255-255-45) 45%, transparent 60%);
  mix-blend-mode: screen; transform: skewX(-20deg) translateX(-120%);
  transition: transform .6s ease; pointer-events: none; opacity: .55;
}
.btn-cta:hover{
  border-color: var(--cp-runtime-rgba-255-255-255-4);
  background: linear-gradient(135deg, var(--cp-runtime-rgba-255-91-91-6), var(--cp-runtime-rgba-255-154-60-65));
  box-shadow: 0 10px 22px var(--cp-runtime-rgba-0-0-0-65), 0 0 0 6px var(--cp-runtime-rgba-255-154-60-16);
}
.btn-cta:hover::after{ transform: translateX(3px); }
.btn-cta:hover::before{ transform: skewX(-20deg) translateX(120%); }
.btn-cta:active{
  transform: translateY(1px) scale(.98);
  box-shadow: 0 6px 16px var(--shadow), 0 0 0 0 var(--cp-runtime-rgba-255-154-60-0);
}
@keyframes ctaPulse {
  0%,100% { box-shadow: 0 6px 16px var(--shadow), 0 0 0 0 var(--cp-runtime-rgba-255-154-60-0);}
  50%{ box-shadow: 0 8px 18px var(--cp-runtime-rgba-0-0-0-7), 0 0 0 6px var(--cp-runtime-rgba-255-154-60-18);}
}
.btn-cta{ animation: ctaPulse 4.5s ease-in-out infinite; }

/* ---------- Cards / Grid ---------- */
.grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(232px,1fr));gap:14px;
}
.grid-lg{grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
@media(max-width:560px){.grid{grid-template-columns:repeat(2,1fr);gap:12px}}
@media(max-width:380px){.grid{grid-template-columns:1fr}}

.card{
  display:block;
  background:var(--panel);
  border:1px solid var(--line);
  border-radius:14px;
  overflow:hidden;
  box-shadow:0 6px 18px var(--shadow);
  transition:transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}
.card:hover{transform:translateY(-4px);box-shadow:0 10px 26px var(--cp-runtime-rgba-0-0-0-7);border-color:var(--line-2)}
.thumb{
  position:relative;
  background:var(--cp-runtime-1a0000) center/cover no-repeat;
  border-bottom:1px solid var(--line);
  aspect-ratio: var(--fv-thumb-aspect-ratio, 16/9);
}
.thumb-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top, var(--cp-runtime-rgba-0-0-0-7) 0%, var(--cp-runtime-rgba-0-0-0-12) 70%);
}
.duration{
  position:absolute;right:8px;bottom:8px;
  background:var(--cp-runtime-rgba-0-0-0-7);color:var(--text-on-theme);
  padding:4px 7px;border-radius:7px;
  font-size:12px;font-weight:800;
}
.badge-hd{
  position:absolute;left:8px;top:8px;
  padding:4px 8px;border-radius:8px;
  font:800 11px/1 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu;
  color:var(--text-on-theme);
  border:1px solid var(--cp-runtime-rgba-255-255-255-35);
  background:var(--cp-runtime-rgba-255-255-255-12);
  backdrop-filter: blur(6px) saturate(120%);
  -webkit-backdrop-filter: blur(6px) saturate(120%);
}
.title{
  font-weight:800;
  padding:10px 10px 3px;
  letter-spacing:.2px;
  font-size:13px;
  line-height:1.25;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  min-height:2.5em;
}
.meta{
  color:var(--muted);
  font-size:12px;
  padding:0 10px 12px;
}
.badge{background:var(--cp-runtime-16233d);color:var(--cp-runtime-cbd5e1);border:1px solid var(--cp-runtime-223459);border-radius:999px;padding:4px 8px;font-size:12px}

/* ---------- Sidebar ---------- */
.sidebar{position:sticky;top:182px;align-self:start}
.sidebar .panel{
  background:var(--panel-2);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:14px;
  padding:12px;
}
.sidebar .section-title{display:flex;align-items:center;justify-content:space-between;margin:6px 0 10px}
.cat-list{display:grid;grid-template-columns:1fr 1fr;gap:8px}
@media(max-width:680px){ .cat-list{grid-template-columns:1fr} }
.cat-pill{
  display:block;
  background:var(--cp-runtime-3a0000);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:999px;
  padding:8px 12px;
  color:var(--cp-runtime-ffe0e0);
  font-weight:700;
}
.cat-more{
  margin-top:10px;width:100%;
  background:var(--cp-runtime-400000);
  border:1px solid var(--cp-runtime-6a1515);
  color:var(--cp-runtime-ffe0e0);
  border-radius:12px;
  padding:10px;
  font-weight:800;cursor:pointer;
}
.sidebar-banners{margin-top:8px;display:flex;flex-direction:column;gap:12px}
.ad-card{
  position:relative;overflow:hidden;
  border-radius:14px;
  background:var(--cp-runtime-340000);
  border:1px solid var(--cp-runtime-6a1515);
  box-shadow:0 10px 26px var(--cp-runtime-rgba-0-0-0-7);
  transition:transform .22s ease, box-shadow .22s ease;
}
.ad-card:hover{transform:translateY(-3px);box-shadow:0 14px 34px var(--cp-runtime-rgba-0-0-0-8)}
.ad-card img{
  width:100%;height:auto;display:block;
  transition:opacity .38s ease, transform .32s ease;
}
.ad-label{
  position:absolute;top:8px;left:8px;
  background:var(--cp-runtime-rgba-0-0-0-8);
  color:var(--text-on-theme);
  font:800 10px/1 system-ui;
  padding:4px 7px;border-radius:6px;
}

/* ---------- Watch Page / Player ---------- */
.watch{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px}
@media(max-width:1100px){.watch{grid-template-columns:1fr}}
.video{position:relative;width:100%;background:var(--cp-runtime-000000);border-radius:16px;border:1px solid var(--line);overflow:hidden;box-shadow:var(--shadow)}
.player-wrap{
  background:var(--cp-runtime-000000);
  border-radius:16px;
  overflow:hidden;
  box-shadow:0 10px 28px var(--cp-runtime-rgba-0-0-0-8);
}
.player{width:100%;display:block}
video.player{width:100%;aspect-ratio:16/9;height:auto;display:block;background:var(--cp-runtime-000000)}
.embed-wrapper{position:relative;padding-top:56.25%;background:var(--cp-runtime-000000);border-radius:16px;overflow:hidden}
.embed-wrapper iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.watch-title{font-size:clamp(18px,2.6vw,26px);font-weight:900;margin:12px 0 4px}
.watch-meta{color:var(--muted);font-size:13px;margin-bottom:10px}
.pill{
  display:inline-block;margin:0 6px 6px 0;
  background:var(--cp-runtime-3a0000);
  border:1px solid var(--cp-runtime-6a1515);
  color:var(--cp-runtime-ffe0e0);
  padding:6px 10px;border-radius:999px;
  font-weight:800;font-size:12px;
}
.actionbar{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 14px;align-items:center}
.ab-btn{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--cp-runtime-3a0000);
  border:1px solid var(--cp-runtime-6a1515);
  color:var(--cp-runtime-ffe0e0);
  padding:9px 12px;border-radius:12px;
  font-weight:900;cursor:pointer;
  transition:background .18s ease, border-color .18s ease;
}
.ab-btn:hover{background:var(--accent);border-color:var(--cp-runtime-8a1515)}
.ab-btn svg{flex-shrink:0}

/* Like Button */
.ab-like .like-icon{transition:fill .2s ease, stroke .2s ease}
.ab-like.liked{background:var(--accent);border-color:var(--brand)}
.ab-like.liked .like-icon{fill:var(--brand);stroke:var(--brand)}

/* Server group */
.ab-servers{display:inline-flex;gap:6px;flex-shrink:0}
.server-btn.active{background:var(--brand);border-color:var(--brand);color:var(--text-on-theme)}
@media(max-width:600px){.ab-servers{width:100%;justify-content:center}}

.channel{
  display:flex;gap:12px;align-items:center;
  background:var(--panel-2);
  border:1px solid var(--cp-runtime-6a1515);
  padding:12px;border-radius:14px;margin-top:10px;
}
.avatar{
  width:44px;height:44px;border-radius:999px;
  background:var(--cp-runtime-4a0000);
  display:grid;place-items:center;
  font-weight:900;
}
.desc{
  background:var(--panel-2);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:14px;
  padding:12px;margin-top:10px;
}
.rail{
  position:sticky;top:182px;align-self:start;
  display:flex;flex-direction:column;gap:14px;
}
.rail .panel{
  background:var(--panel-2);
  border:1px solid var(--cp-runtime-6a1515);
  border-radius:14px;padding:12px;
}
.up-card{display:flex;gap:10px;background:var(--cp-runtime-0e1425);border:1px solid var(--line);border-radius:12px;overflow:hidden;margin-bottom:10px}
.up-thumb{flex:0 0 140px;background:var(--cp-runtime-0c1220) center/cover no-repeat;position:relative;aspect-ratio:var(--fv-thumb-aspect-ratio, 16/9)}
.up-duration{position:absolute;right:6px;bottom:6px;background:var(--cp-runtime-rgba-0-0-0-65);color:var(--text-on-theme);padding:2px 6px;border-radius:6px;font-size:11px;font-weight:800}
.up-body{padding:8px 10px 10px;display:flex;flex-direction:column;justify-content:center}
.up-title{
  font-weight:800;line-height:1.25;margin-bottom:4px;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  line-clamp:2;
  overflow:hidden;
  text-overflow:ellipsis;
  min-height:2.5em;
}
.up-meta{font-size:12px;color:var(--muted)}

.watch-ads-top{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:12px;margin:4px 0 12px;
}
@media (max-width:980px){
  .watch-ads-top{ grid-template-columns:1fr; }
  .watch-ads-top .slot-1, .watch-ads-top .slot-2{ display:none; }
}
.watch-ads{
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:12px;margin:12px 0 16px;
}
@media (max-width:980px){ .watch-ads{ grid-template-columns:1fr; } }
@media (max-width:768px){ .watch-ads .slot-1, .watch-ads .slot-2{ display:none; } }

/* ---------- Pagination ---------- */
.pager-wrap{position:relative;margin:16px 0;display:flex;justify-content:center}
.pager-scroll{
  display:flex; align-items:stretch; gap:0;
  overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch;
  border:1px solid var(--line); border-radius:16px; background:var(--cp-runtime-3a0000);
  padding:4px; max-width:100%;
  scroll-snap-type:x mandatory;
  white-space:nowrap;
}
.pager-scroll::-webkit-scrollbar{height:10px}
.pager-scroll::-webkit-scrollbar-thumb{background:var(--cp-runtime-6a1515);border-radius:999px}
.page-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:46px; padding:9px 14px; height:40px;
  border-right:1px solid var(--cp-runtime-6a1515);
  font-weight:800; color:var(--cp-runtime-ffdede); background:transparent;
  text-decoration:none; scroll-snap-align:start;
}
.page-btn:first-child{ border-top-left-radius:12px; border-bottom-left-radius:12px; }
.page-btn:last-child{ border-right:0; border-top-right-radius:12px; border-bottom-right-radius:12px; }
.page-btn:hover{ background:var(--accent); }
.page-btn.active{ background:var(--brand); color:var(--text-on-theme); }
.page-btn.disabled{ opacity:.35; pointer-events:none; }
.page-ellipsis{ display:inline-flex; align-items:center; padding:0 12px; color:var(--muted); }

@media (max-width:520px){
  .pager-wrap{ margin:12px -10px; }
  .pager-scroll{ border-radius:0; }
}

@media (max-width:768px){
  .hero{border-radius:12px;margin:8px 0 12px}
  .hero .content{padding:14px}
  .hero h1{font-size:18px}
  .chip{padding:5px 8px;font-size:12px;border-radius:999px}
  .btn-cta{padding:8px 12px;border-radius:12px;font-size:14px}
}

/* ---------- Tables & Alerts ---------- */
.table{width:100%;border-collapse:collapse}
.table th,.table td{border-bottom:1px solid var(--line);padding:10px 8px;text-align:left;font-size:14px}
.alert{padding:10px 12px;border:1px solid var(--line);background:var(--cp-runtime-0d1426);border-radius:10px}

/* ---------- Footer ---------- */
.footer{padding:28px;text-align:center;color:var(--cp-runtime-94a3b8);border-top:1px solid var(--line);margin-top:24px}

/* ---------- Video Ad Overlay ---------- */
.ad-overlay{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  z-index:50;text-align:center;
}
.ad-overlay img{
  max-width:360px;width:94%;height:auto;border-radius:10px;
  box-shadow:0 12px 34px var(--cp-runtime-rgba-0-0-0-6);border:1px solid var(--line);
}
.close-ad{
  display:inline-block;margin-top:8px;padding:8px 14px;background:var(--danger);
  color:var(--text-on-theme);font-size:13px;font-weight:800;border:none;border-radius:10px;cursor:pointer;
}

/* ---------- Responsive Tweaks (≤380px) ---------- */
@media (max-width: 380px){
  .container{ padding: 0 10px; }
  .layout{ gap: 14px; }
  .mast-row{ grid-template-columns: 36px 1fr 36px; padding: 6px 8px; min-height: 52px; }
  .icon-btn{ width:36px; height:36px; border-radius:9px; }
  .brand-logo{ height:24px; }
  .tabbar-scroll{ padding: 6px 8px; gap: 8px; }
  .tabbar-scroll a{ padding: 6px 9px; font-size: 12.5px; }
  .hero{ border-radius: 12px; margin: 0 0 10px; aspect-ratio:16/9; }
  .hero .content{ padding: 10px 10px 12px; }
  .hero h1{ font-size: 15px; line-height: 1.25; }
  .chip{ padding: 3px 7px; font-size: 10.5px; border-radius: 999px; }
  .btn-cta{ padding: 6px 10px; font-size: 12.5px; border-radius: 11px; }
  .grid{ grid-template-columns: 1fr 1fr; gap: 8px; }
  .card{ border-radius: 12px; }
  .badge-hd{ font-size:10px; padding:3px 7px; border-radius:7px; }
  .duration{ font-size:10.5px; padding:2px 5px; }
  .title{ font-size:11.75px; padding:8px 8px 3px; }
  .meta{ font-size:11px; padding:0 8px 10px; }
  .sidebar{ position: static; top: auto; }
}

/* ---------- Floating Telegram Button ---------- */
.tg-float{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:120;
  text-decoration:none;
}
.tg-float-btn{
  width:54px;
  height:54px;
  border-radius:999px;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at 30% 0,var(--cp-runtime-62d4ff),var(--cp-runtime-0088cc));
  box-shadow:0 10px 24px var(--cp-runtime-rgba-0-0-0-7);
  border:1px solid var(--cp-runtime-rgba-255-255-255-45);
  transition:transform .18s ease, box-shadow .18s ease, opacity .18s ease;
}
.tg-float-btn .tg-icon{
  width:26px;
  height:26px;
  fill:var(--text-on-theme);
}
.tg-float:hover .tg-float-btn{
  transform:translateY(-2px) scale(1.03);
  box-shadow:0 14px 32px var(--cp-runtime-rgba-0-0-0-85);
}
.tg-float:active .tg-float-btn{
  transform:translateY(0) scale(.97);
  box-shadow:0 8px 18px var(--cp-runtime-rgba-0-0-0-7);
}
@media(max-width:480px){
  .tg-float{
    right:14px;
    bottom:14px;
  }
  .tg-float-btn{
    width:48px;
    height:48px;
  }
}

/* ---------- Banner Ads ---------- */
.fv-header-banner,
.fv-footer-banner {
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 15px auto;
  max-width: 100%;
  overflow: hidden;
}
.fv-header-banner img,
.fv-footer-banner img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* ---------- Age Gate Custom Style ---------- */
.age-gate {
  background: var(--cp-runtime-rgba-48-0-0-0-96) !important;
  backdrop-filter: blur(10px) !important;
  -webkit-backdrop-filter: blur(10px) !important;
  font-family: system-ui, -apple-system, sans-serif !important;
}
.age-gate__content {
  background: var(--panel) !important;
  border: 1px solid var(--line) !important;
  border-radius: 14px !important;
  box-shadow: 0 10px 30px var(--cp-runtime-rgba-0-0-0-0-6) !important;
}
.age-gate__badge {text-align: center !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; 
  border: 2px solid var(--brand) !important;
  color: var(--brand) !important;
  
  font-weight: 800 !important;
  background: var(--cp-runtime-rgba-255-91-91-0-1) !important;
  text-shadow: 0 0 10px var(--cp-runtime-rgba-255-91-91-0-4) !important;
  box-shadow: 0 0 15px var(--cp-runtime-rgba-255-91-91-0-2) !important;
  line-}
.age-gate__title {
  color: var(--text) !important;
  font-size: 1.8rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.5px !important;
}
.age-gate__desc {
  color: var(--muted) !important;
  font-size: 0.95rem !important;
}
.age-gate__btn {
  background: linear-gradient(135deg, var(--brand), var(--brand-2)) !important;
  color: var(--text-on-theme) !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
  transition: all 0.2s ease !important;
  box-shadow: 0 4px 12px var(--cp-runtime-rgba-255-91-91-0-3) !important;
}
.age-gate__btn:hover {
  filter: brightness(1.1) !important;
  box-shadow: 0 6px 16px var(--cp-runtime-rgba-255-91-91-0-5) !important;
  transform: translateY(-1px) !important;
}
.age-gate__btn:active {
  transform: translateY(1px) !important;
}