:root{--bg:#05070f;--card:#0d1018;--text:#fff;--muted:rgba(255,255,255,.48);--accent:#ffcc00;--accent-g:rgba(255,204,0,.30);--accent2:#ff2a6d;--border:rgba(255,255,255,.055);--ease:cubic-bezier(.22,1,.36,1);--ease2:cubic-bezier(.4,0,.2,1)}
*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}
html{height:100%;overflow:hidden;background:var(--bg)}
body{height:100dvh;font-family:'Outfit',system-ui,-apple-system,sans-serif;color:var(--text);overflow:hidden;display:grid;grid-template-rows:54px 1fr;background:var(--bg);padding-bottom:env(safe-area-inset-bottom);font-size:14px;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%}button{border:none;outline:none;background:none;font-family:inherit;cursor:pointer}a{text-decoration:none;color:inherit}
header{grid-row:1;background:var(--bg);z-index:50;padding:0 16px;border-bottom:1px solid var(--border);position:relative}
.hdr{height:100%;display:flex;align-items:center;justify-content:space-between;max-width:1280px;margin:0 auto}
.logo-link{display:flex;align-items:center;height:100%;transition:opacity .15s}.logo-link:active{opacity:.7}
.logo-text{font-size:22px;font-weight:900;letter-spacing:-.3px;color:#fff;display:flex;align-items:center;gap:3px}
.logo-hub{background:var(--accent);color:#000;padding:2px 8px;border-radius:6px;font-weight:900;font-size:21px}
.mail-btn{color:rgba(255,255,255,.4);display:flex;align-items:center;justify-content:center;padding:10px;border-radius:12px;transition:all .15s}
.mail-btn:hover{color:var(--accent);background:rgba(255,255,255,.04)}.mail-btn svg{width:20px;height:20px}
.hdr-right{display:flex;align-items:center;gap:8px}
.aff-btn {
    font-family: 'Outfit', sans-serif;
    font-size: 14px;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 10px;
    background: var(--accent); /* HATA BURADAYDI, DÜZELTİLDİ */
    color: #000 !important;
    transition: all 0.3s var(--ease);
    box-shadow: 0 4px 15px var(--accent-g); /* Kendi parlama efekti eklendi */
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    text-decoration: none;
    position: relative;
    overflow: hidden;
}

.aff-btn::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.6), transparent);
    transition: 0.5s ease;
}

.aff-btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(255, 204, 0, 0.4);
    background: #ffe14d;
}

.aff-btn:hover::after {
    left: 100%;
}


.aff-btn2 {
    font-family: 'Outfit', sans-serif;
    font-size: 14px;
    font-weight: 700;
    padding: 10px 24px;
    border-radius: 10px;
    background: linear-gradient(135deg, #a855f7, #7c3aed);
    color: #fff !important;
    transition: all 0.3s var(--ease);
    box-shadow: 0 4px 15px rgba(168,85,247,0.35);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
    text-decoration: none;
    position: relative;
    overflow: hidden;
}

.aff-btn2::after {
    content: '';
    position: absolute;
    top: 0; left: -100%;
    width: 50%; height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255,255,255,0.5), transparent);
    transition: 0.5s ease;
}

.aff-btn2:hover {
    transform: translateY(-2px);
    box-shadow: 0 8px 25px rgba(168,85,247,0.55);
    background: linear-gradient(135deg, #c084fc, #9333ea);
}

.aff-btn2:hover::after {
    left: 100%;
}
@media(max-width: 768px) {
    .hdr-right { gap: 5px; }
    .aff-btn, .aff-btn2 {
        font-size: 11px;
        padding: 7px 11px;
        border-radius: 8px;
    }
    .logo-text { font-size: 17px; }
    .logo-hub { font-size: 16px; padding: 2px 6px; }
}
@media(max-width: 360px) {
    .aff-btn, .aff-btn2 {
        font-size: 10px;
        padding: 6px 8px;
    }
}
main{grid-row:2;height:100%;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain}
main::-webkit-scrollbar{width:4px}main::-webkit-scrollbar-thumb{background:rgba(255,255,255,.06);border-radius:99px}
.wrap{max-width:1280px;margin:0 auto;padding:0 16px 24px}
.cat-bar{margin:14px 0 16px;display:flex;align-items:center;gap:5px}
.cat-arrow{flex-shrink:0;width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.025);border:1px solid var(--border);color:rgba(255,255,255,.3);display:none;align-items:center;justify-content:center;cursor:pointer;transition:all .15s;z-index:2}
.cat-arrow:hover{color:#fff;background:rgba(255,255,255,.06)}.cat-arrow:active{transform:scale(.88)}
.cat-arrow svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.cat-arrow.fade{opacity:0;pointer-events:none}
@media(min-width:900px){.cat-arrow{display:flex}}
.cats{display:flex;gap:8px;overflow-x:auto;padding:3px 2px;scrollbar-width:none;scroll-behavior:smooth;flex:1;min-width:0}.cats::-webkit-scrollbar{display:none}
.chip{font-size:13px;font-weight:600;padding:10px 22px;border-radius:12px;background:rgba(255,255,255,.06);color:var(--muted);border:1px solid rgba(255,255,255,.08);transition:all .2s var(--ease);white-space:nowrap;flex-shrink:0}
.chip:hover{background:rgba(255,255,255,.10);color:rgba(255,255,255,.8);border-color:rgba(255,255,255,.14)}
.chip.active{background:var(--accent);color:#000;font-weight:800;border-color:var(--accent);box-shadow:0 0 0 2px rgba(255,255,255,.16),0 0 32px var(--accent-g),0 2px 10px rgba(0,0,0,.45);transform:translateY(-1px)}
.grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fill,minmax(275px,1fr));align-items:start}
@media(max-width:600px){.grid{grid-template-columns:1fr;gap:18px}}
@media(min-width:900px){.grid{grid-template-columns:repeat(4,1fr);gap:16px}}
.card{background:var(--card);border-radius:14px;overflow:hidden;position:relative;border:1px solid var(--border);cursor:pointer;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;will-change:transform;contain:layout paint style}
.card:hover{transform:translateY(-5px);box-shadow:0 20px 60px rgba(0,0,0,.5),0 0 0 1px rgba(255,255,255,.08);border-color:rgba(255,255,255,.1)}
.thumb{position:relative;width:100%;aspect-ratio:16/9;background:#080a12;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--ease),filter .3s}
.card:hover .thumb img{transform:scale(1.06);filter:brightness(1.08)}
.play-over{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .25s}
.card:hover .play-over{opacity:1}
.play-icon{width:46px;height:46px;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.5);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-radius:50%;border:1.5px solid rgba(255,255,255,.18);transition:transform .2s var(--ease)}
.card:hover .play-icon{transform:scale(1.08)}
.play-icon svg{width:16px;height:16px;fill:#fff;margin-left:2px}
.dur{position:absolute;bottom:8px;right:8px;background:rgba(0,0,0,.72);color:#fff;padding:3px 7px;border-radius:5px;font-size:10px;font-weight:700;backdrop-filter:blur(6px)}
.meta{padding:12px 14px 14px}
.title{font-size:13.5px;line-height:1.45;font-weight:600;margin:0 0 8px;color:#fff;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:calc(1.45em * 2)}
.card-tags{display:flex;flex-wrap:nowrap;gap:5px;min-height:22px;max-height:22px;overflow:hidden;align-items:flex-start}
.card-tag{font-size:10px;font-weight:600;padding:3px 8px;border-radius:5px;background:rgba(255,255,255,.04);color:var(--muted);border:1px solid rgba(255,255,255,.04);transition:all .2s;white-space:nowrap;flex:0 0 auto}
.card:hover .card-tag{background:rgba(255,204,0,.08);color:rgba(255,204,0,.7);border-color:rgba(255,204,0,.12)}
.card-tag-hd{color:var(--accent);background:rgba(255,204,0,.08);border-color:rgba(255,204,0,.1)}
.ad-card{position:relative;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,var(--ad-border-color,#12f7e8),rgba(255,255,255,.18),var(--ad-border-color,#12f7e8));padding:var(--ad-border-width,2px);box-shadow:0 12px 38px rgba(0,0,0,.38),0 0 28px rgba(18,247,232,.10);transition:transform .35s var(--ease),box-shadow .35s var(--ease),filter .35s var(--ease);aspect-ratio:6/5;min-height:0;align-self:start;box-sizing:border-box;line-height:0}
.ad-card.ad-desktop{aspect-ratio:auto;height:var(--ad-card-h,auto);min-height:var(--ad-card-h,0);max-height:var(--ad-card-h,none)}
.ad-card.ad-mobile{aspect-ratio:16/9;height:auto}
.ad-card.ad-no-border{padding:0;background:transparent;box-shadow:0 12px 38px rgba(0,0,0,.28)}
.ad-card::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(120deg,transparent 0%,rgba(255,255,255,.28) 45%,transparent 70%);opacity:.16;pointer-events:none;z-index:2}
.ad-card.ad-no-border::before{display:none}
.ad-card:hover{box-shadow:0 18px 48px rgba(0,0,0,.48),0 0 36px rgba(18,247,232,.16);filter:saturate(1.04)}
.ad-card a,.ad-card .ad-link{display:block;position:relative;width:100%;height:100%;border-radius:calc(16px - min(var(--ad-border-width,2px),8px));overflow:hidden;background:#070a12}
.ad-card picture{display:block;width:100%;height:100%}
.ad-card img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .42s var(--ease),filter .35s var(--ease)}
.ad-card:hover img{transform:scale(1.035);filter:brightness(1.06)}
@media(max-width:600px){.ad-card,.ad-card.ad-desktop,.ad-card.ad-mobile{aspect-ratio:16/9;height:auto!important}}
.card,.ad-card{opacity:0;transform:translateY(12px)}
.card.visible,.ad-card.visible{opacity:1;transform:translateY(0);transition:opacity .4s var(--ease2),transform .4s var(--ease2)}
.card:nth-child(1).visible,.ad-card:nth-child(1).visible{transition-delay:0s}.card:nth-child(2).visible,.ad-card:nth-child(2).visible{transition-delay:.04s}.card:nth-child(3).visible,.ad-card:nth-child(3).visible{transition-delay:.08s}.card:nth-child(4).visible,.ad-card:nth-child(4).visible{transition-delay:.12s}.card:nth-child(5).visible,.ad-card:nth-child(5).visible{transition-delay:.16s}.card:nth-child(6).visible,.ad-card:nth-child(6).visible{transition-delay:.2s}.card:nth-child(7).visible,.ad-card:nth-child(7).visible{transition-delay:.24s}.card:nth-child(8).visible,.ad-card:nth-child(8).visible{transition-delay:.28s}.card:nth-child(n+9).visible,.ad-card:nth-child(n+9).visible{transition-delay:.3s}
.skeleton{animation:shimmer 1.8s ease infinite;background:linear-gradient(110deg,rgba(255,255,255,.02) 30%,rgba(255,255,255,.06) 50%,rgba(255,255,255,.02) 70%);background-size:200% 100%}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin:20px 0 0;flex-wrap:wrap}
.pg-btn{min-width:40px;height:38px;padding:0 12px;border-radius:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);color:#fff;font-weight:700;font-size:12px;display:inline-flex;align-items:center;justify-content:center;transition:all .2s var(--ease);user-select:none}
.pg-btn:hover{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.14)}.pg-btn.active{background:var(--accent);color:#000;border-color:var(--accent);box-shadow:0 0 20px var(--accent-g)}.pg-btn.disabled{opacity:.3;cursor:not-allowed;pointer-events:none}
.pg-dots{color:rgba(255,255,255,.3);font-weight:800;padding:0 4px;font-size:12px}

/* ══════════ MODAL + PLAYER ══════════ */
#modal{position:fixed;inset:0;z-index:9999;background:rgba(0,0,0,.92);display:none;opacity:0;transition:opacity .3s var(--ease2);backdrop-filter:blur(6px)}
#modal.open{display:flex}#modal.show{opacity:1}
.modal-inner{width:100%;height:100%;max-width:1100px;margin:0 auto;display:flex;flex-direction:column;background:#000}
@media(min-width:900px){.modal-inner{border-left:1px solid var(--border);border-right:1px solid var(--border)}}
.player-sec{flex:0 0 auto;width:100%;position:relative;background:#000;z-index:10}
.close-btn{position:absolute;top:14px;right:14px;z-index:100;background:rgba(0,0,0,.5);color:#fff;border:1px solid rgba(255,255,255,.12);border-radius:8px;padding:6px 14px;font-size:11px;font-weight:600;display:flex;align-items:center;gap:6px;backdrop-filter:blur(10px);transition:all .15s}
.close-btn:hover{background:var(--accent);color:#000;border-color:var(--accent)}
#playerBox{width:100%;background:#000;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;aspect-ratio:16/9}
@media(min-width:900px){#playerBox{aspect-ratio:auto;height:60vh;max-height:650px}}
.plyr{width:100%;height:100%}
.plyr__video-wrapper{height:100%;width:100%;display:flex;align-items:center;justify-content:center}
video{width:100%!important;height:100%!important;object-fit:contain!important}
.plyr__controls{z-index:30!important}
.plyr--fullscreen-active{z-index:2147483647!important}

/* NUKE Plyr's default big play button — every possible selector */
.plyr__control--overlaid{display:none!important;width:0!important;height:0!important;opacity:0!important;pointer-events:none!important;visibility:hidden!important;position:absolute!important;clip:rect(0,0,0,0)!important;overflow:hidden!important}
.plyr__control[data-plyr="play"]:not([class*="plyr__controls"] *){display:none!important}
.plyr__poster{display:none!important}

/* Custom mid controls */
.fh-mid{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:44px;z-index:25;pointer-events:none;transition:opacity .2s;opacity:0}
.plyr--paused .fh-mid,.plyr--video:not(.plyr--hide-controls) .fh-mid{opacity:1}
.plyr--playing.plyr--hide-controls .fh-mid{opacity:0}
.fh-b{pointer-events:auto;cursor:pointer;display:flex;align-items:center;justify-content:center;border:none;color:#fff;border-radius:50%;background:rgba(15,15,25,.55);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:transform .12s,background .15s;flex-shrink:0;aspect-ratio:1/1;box-sizing:border-box;padding:0}
.fh-b:active{transform:scale(.88)}.fh-b:hover{background:rgba(255,255,255,.1)}
.fh-s{width:42px;height:42px;min-width:42px;min-height:42px}.fh-s svg{width:18px;height:18px;fill:rgba(255,255,255,.85);flex-shrink:0}
.fh-c{width:56px;height:56px;min-width:56px;min-height:56px;border:1px solid rgba(255,255,255,.12)}
.fh-c:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.2)}
.fh-c svg{width:22px;height:22px;fill:#fff;margin-left:2px;flex-shrink:0}

.vid-info{flex:0 0 auto;padding:14px 20px 12px;background:#060810;border-bottom:1px solid var(--border)}
.vid-h1{font-size:15px;font-weight:600;line-height:1.4;color:#fff}
.rel-sec{flex:1 1 auto;overflow-y:auto;padding:16px 20px;background:var(--bg)}
.rel-title{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:var(--accent2);font-weight:800;margin-bottom:14px}
.rel-grid{display:flex;flex-direction:column;gap:12px}
.rel-item{display:flex;align-items:flex-start;gap:12px;padding-bottom:12px;border-bottom:1px solid rgba(255,255,255,.03);cursor:pointer}.rel-item:last-child{border-bottom:none}
.rel-img-w{width:130px;aspect-ratio:16/9;flex-shrink:0;border-radius:8px;overflow:hidden;background:#111}.rel-img{width:100%;height:100%;object-fit:cover}
.rel-meta{flex:1;min-width:0;padding-top:2px}
.rel-txt{font-size:12px;color:#ccc;font-weight:500;line-height:1.4;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rel-tag{font-size:10px;color:var(--muted)}
.empty{padding:80px 20px;text-align:center;color:var(--muted);display:none;grid-column:1/-1}
.ph{width:100%;height:100%;background:#0a0d16}
#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%);background:var(--accent);color:#000;padding:10px 22px;border-radius:25px;font-weight:700;font-size:12px;box-shadow:0 8px 30px rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:opacity .25s;z-index:10000;text-align:center}
#toast.show{opacity:1}
@media(min-width:900px){body{grid-template-rows:54px 1fr}.chip{padding:9px 20px;font-size:12px}.meta{padding:11px 13px 13px}.title{font-size:13px;margin-bottom:6px}}
@media(max-width:560px){}

/* === God-mode visual polish pack: style-only frontend refinement === */
html{background:#03050c}
body{
  background:
    radial-gradient(circle at 14% -10%,rgba(255,204,0,.075),transparent 28%),
    radial-gradient(circle at 86% 2%,rgba(255,42,109,.055),transparent 30%),
    radial-gradient(circle at 50% 112%,rgba(18,247,232,.045),transparent 36%),
    linear-gradient(180deg,#050711 0%,#03050b 45%,#05070f 100%);
}
body::before{content:'';position:fixed;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle at 50% 0%,#000 0%,transparent 72%);opacity:.38}
header{background:rgba(5,7,15,.78);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 14px 40px rgba(0,0,0,.22)}
header::after{content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,204,0,.26),rgba(255,42,109,.16),transparent);pointer-events:none}
.logo-link{filter:drop-shadow(0 8px 22px rgba(255,204,0,.08))}.logo-hub{box-shadow:0 0 22px var(--accent-g)}
.wrap{position:relative}.cat-bar{position:relative;margin-top:16px;margin-bottom:18px;padding:6px 0}.cat-bar::before,.cat-bar::after{content:'';position:absolute;top:0;bottom:0;width:34px;z-index:1;pointer-events:none}.cat-bar::before{left:28px;background:linear-gradient(90deg,var(--bg),transparent)}.cat-bar::after{right:28px;background:linear-gradient(270deg,var(--bg),transparent)}
.cats{padding:5px 4px 7px;scroll-padding-inline:48px}.chip{display:inline-flex;align-items:center;justify-content:center;gap:8px;position:relative;background:linear-gradient(180deg,rgba(255,255,255,.072),rgba(255,255,255,.038));box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 10px 28px rgba(0,0,0,.12)}.chip:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 34px rgba(0,0,0,.22)}.chip.active{gap:9px;background:linear-gradient(135deg,#ffe67a 0%,var(--accent) 42%,#ff9d00 100%);box-shadow:0 0 0 1px rgba(255,255,255,.26),0 0 0 4px rgba(255,204,0,.055),0 18px 42px rgba(255,204,0,.18),0 12px 34px rgba(0,0,0,.32)}.chip.active::after{content:'';position:absolute;inset:1px;border-radius:inherit;background:linear-gradient(115deg,rgba(255,255,255,.42),transparent 38%,transparent 70%,rgba(255,255,255,.20));opacity:.22;pointer-events:none}.chip-label{position:relative;z-index:1}.chip-clear{position:relative;z-index:2;width:18px;height:18px;border-radius:999px;background:rgba(0,0,0,.17);color:#000;display:inline-flex;align-items:center;justify-content:center;font-size:15px;font-weight:900;line-height:1;margin-right:-10px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);transition:transform .16s var(--ease),background .16s var(--ease),box-shadow .16s var(--ease)}.chip-clear:hover{transform:scale(1.08) rotate(90deg);background:rgba(0,0,0,.25);box-shadow:inset 0 0 0 1px rgba(0,0,0,.18),0 4px 10px rgba(0,0,0,.20)}.chip-clear:active{transform:scale(.92) rotate(90deg)}
.cat-arrow{background:rgba(255,255,255,.045);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 10px 24px rgba(0,0,0,.18)}.cat-arrow:hover{background:rgba(255,204,0,.14);color:var(--accent);border-color:rgba(255,204,0,.20)}
.grid{perspective:1200px}.card{background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.018)),var(--card);box-shadow:0 14px 36px rgba(0,0,0,.20),inset 0 1px 0 rgba(255,255,255,.028);isolation:isolate}.card::before{content:'';position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,rgba(255,255,255,.10),transparent 32%,transparent 72%,rgba(255,204,0,.055));opacity:0;transition:opacity .35s var(--ease);pointer-events:none;z-index:2}.card::after{content:'';position:absolute;inset:-1px;border-radius:inherit;background:linear-gradient(135deg,rgba(255,204,0,.34),rgba(255,255,255,.04),rgba(255,42,109,.18));opacity:0;transition:opacity .35s var(--ease);pointer-events:none;z-index:-1}.card.visible:hover{transform:translateY(-7px) scale(1.012);box-shadow:0 28px 75px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.09),0 0 34px rgba(255,204,0,.07)}.card.visible:hover::before,.card.visible:hover::after{opacity:1}.thumb{background:linear-gradient(135deg,#090d18,#05070f)}.thumb::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 42%,rgba(0,0,0,.52) 100%),radial-gradient(circle at 50% 50%,rgba(255,255,255,.04),transparent 54%);opacity:.82;transition:opacity .35s var(--ease);pointer-events:none}.card:hover .thumb::after{opacity:.62}.play-over{background:radial-gradient(circle at 50% 50%,rgba(0,0,0,.38),rgba(0,0,0,.06) 42%,transparent 67%)}.play-icon{background:rgba(8,10,16,.62);box-shadow:0 12px 34px rgba(0,0,0,.38),0 0 0 6px rgba(255,255,255,.035)}.card:hover .play-icon{box-shadow:0 14px 36px rgba(0,0,0,.44),0 0 0 7px rgba(255,204,0,.08),0 0 24px rgba(255,204,0,.12);border-color:rgba(255,204,0,.28)}.dur{box-shadow:0 6px 18px rgba(0,0,0,.35);border:1px solid rgba(255,255,255,.09)}.meta{background:linear-gradient(180deg,rgba(255,255,255,.012),rgba(0,0,0,.035))}.title{text-shadow:0 1px 0 rgba(0,0,0,.25)}.card-tag{background:rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.04)}.card-tag-hd{box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 14px rgba(255,204,0,.05)}
.ad-card{box-shadow:0 18px 48px rgba(0,0,0,.34),0 0 32px rgba(18,247,232,.13)}.ad-card.visible:hover{transform:translateY(-5px) scale(1.01);box-shadow:0 28px 72px rgba(0,0,0,.52),0 0 46px rgba(18,247,232,.20)}.ad-card a,.ad-card .ad-link{box-shadow:inset 0 0 0 1px rgba(255,255,255,.045)}
.pagination{margin-top:24px}.pg-btn{background:linear-gradient(180deg,rgba(255,255,255,.072),rgba(255,255,255,.035));box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 10px 28px rgba(0,0,0,.14)}.pg-btn:hover{transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.075),0 14px 32px rgba(0,0,0,.25)}.pg-btn.active{background:linear-gradient(135deg,#ffe67a,var(--accent));box-shadow:0 0 0 1px rgba(255,255,255,.22),0 0 24px var(--accent-g),0 14px 34px rgba(0,0,0,.30)}
#modal{background:radial-gradient(circle at 50% 8%,rgba(255,204,0,.06),transparent 34%),rgba(0,0,0,.93);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.modal-inner{background:linear-gradient(180deg,#030409,#070911);box-shadow:0 0 80px rgba(0,0,0,.65)}@media(min-width:900px){.modal-inner{border-left:1px solid rgba(255,255,255,.065);border-right:1px solid rgba(255,255,255,.065)}}#playerBox{box-shadow:0 24px 80px rgba(0,0,0,.38)}.close-btn{box-shadow:0 12px 26px rgba(0,0,0,.28)}.vid-info{background:linear-gradient(180deg,#080a13,#050711)}.rel-sec{background:linear-gradient(180deg,#050711,#03050b)}.rel-title{color:var(--accent);text-shadow:0 0 18px var(--accent-g)}.rel-item{border-bottom-color:rgba(255,255,255,.045);border-radius:12px;padding:8px 8px 12px;transition:background .18s var(--ease),transform .18s var(--ease)}.rel-item:hover{background:rgba(255,255,255,.035);transform:translateX(2px)}.rel-img-w{box-shadow:0 12px 28px rgba(0,0,0,.30);border:1px solid rgba(255,255,255,.05)}
.empty{border:1px solid rgba(255,255,255,.055);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.015));box-shadow:0 18px 50px rgba(0,0,0,.20)}#toast{box-shadow:0 12px 36px rgba(0,0,0,.48),0 0 24px var(--accent-g)}
@media(max-width:600px){.cat-bar::before{left:0}.cat-bar::after{right:0}.chip-clear{margin-right:-8px}.card.visible:hover{transform:translateY(0) scale(1)}.ad-card.visible:hover{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.card,.ad-card,.chip,.pg-btn,.thumb img,.play-icon,.rel-item{transition:none!important}.card.visible:hover,.ad-card.visible:hover,.chip:hover,.pg-btn:hover{transform:none!important}}


/* === Divine polish pass 2: compact category rail + premium frontend surfaces (style-only) === */
:root{
  --surface-hi:rgba(255,255,255,.072);
  --surface-lo:rgba(255,255,255,.024);
  --line-soft:rgba(255,255,255,.075);
  --line-hot:rgba(255,204,0,.18);
  --shadow-card:0 18px 54px rgba(0,0,0,.34);
  --shadow-card-hover:0 30px 86px rgba(0,0,0,.56),0 0 38px rgba(255,204,0,.075);
}
main{scrollbar-color:rgba(255,255,255,.12) transparent}
.wrap{padding-bottom:28px}

/* Compact category spacing */
.cat-bar{margin:8px 0 11px!important;padding:1px 0 3px!important;gap:6px}
.cats{padding:3px 4px 4px!important;gap:7px!important;scroll-padding-inline:54px}
.cat-arrow{width:26px;height:26px;border-radius:999px}
.cat-arrow svg{width:12px;height:12px}
.cat-bar::before,.cat-bar::after{top:-2px!important;bottom:-2px!important;width:30px!important}.cat-bar::before{left:26px!important}.cat-bar::after{right:26px!important}
.chip{min-height:34px;padding:8px 18px!important;border-radius:999px;border-color:rgba(255,255,255,.075);letter-spacing:.01em}
.chip.active{min-height:35px;box-shadow:0 0 0 1px rgba(255,255,255,.28),0 0 0 5px rgba(255,204,0,.045),0 16px 40px rgba(255,204,0,.16),0 10px 30px rgba(0,0,0,.35)!important}
.chip-clear{width:17px;height:17px;font-size:14px;margin-right:-8px}

/* Header polish */
header{box-shadow:0 14px 46px rgba(0,0,0,.30),inset 0 -1px 0 rgba(255,255,255,.025)}
.logo-text{letter-spacing:-.55px}.logo-hub{border-radius:8px;box-shadow:0 0 0 1px rgba(0,0,0,.16),0 0 24px rgba(255,204,0,.22)}
.mail-btn{background:rgba(255,255,255,.025);border:1px solid rgba(255,255,255,.04)}
.mail-btn:hover{border-color:rgba(255,204,0,.16);box-shadow:0 10px 26px rgba(0,0,0,.16),0 0 20px rgba(255,204,0,.06)}
.aff-btn,.aff-btn2{border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 28px rgba(0,0,0,.20),0 0 20px var(--accent-g)}
.aff-btn2{box-shadow:0 10px 28px rgba(0,0,0,.20),0 0 22px rgba(168,85,247,.30)}

/* Grid/card polish */
.grid{gap:17px}.card{border-radius:18px;border-color:rgba(255,255,255,.065);box-shadow:var(--shadow-card),inset 0 1px 0 rgba(255,255,255,.036);background:linear-gradient(180deg,rgba(255,255,255,.048),rgba(255,255,255,.018) 42%,rgba(0,0,0,.09)),#0b0f18}
.card.visible:hover{box-shadow:var(--shadow-card-hover),0 0 0 1px rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.13)}
.thumb{border-bottom:1px solid rgba(255,255,255,.04);background:linear-gradient(135deg,#0b1020,#05070f)}
.thumb::before{content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 0%,rgba(255,255,255,.10) 44%,transparent 58%);opacity:0;transform:translateX(-40%);transition:opacity .35s var(--ease),transform .7s var(--ease);pointer-events:none;z-index:2}
.card:hover .thumb::before{opacity:.26;transform:translateX(38%)}
.thumb img{backface-visibility:hidden;transform-origin:center center}
.meta{padding:12px 14px 13px;background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(0,0,0,.055))}
.title{font-weight:650;letter-spacing:.003em;color:rgba(255,255,255,.94)}
.card:hover .title{color:#fff}.card-tags{gap:6px}.card-tag{border-radius:999px;padding:3px 8px;background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.055)}
.card-tag-hd{background:linear-gradient(135deg,rgba(255,204,0,.16),rgba(255,204,0,.055));border-color:rgba(255,204,0,.18)}
.dur{border-radius:999px;padding:4px 8px;background:rgba(0,0,0,.66);border-color:rgba(255,255,255,.12)}
.play-icon{width:48px;height:48px;background:rgba(5,7,15,.62);border-color:rgba(255,255,255,.20)}

/* Ad card visual consistency */
.ad-card{border-radius:18px;box-shadow:0 18px 52px rgba(0,0,0,.36),0 0 34px rgba(18,247,232,.13)}
.ad-card a,.ad-card .ad-link{border-radius:calc(18px - min(var(--ad-border-width,2px),8px))}
.ad-card.visible:hover{box-shadow:0 30px 84px rgba(0,0,0,.56),0 0 46px rgba(18,247,232,.20)!important}

/* Pagination/modal polish */
.pagination{margin-top:22px;padding-top:4px}.pg-btn{border-radius:999px;border-color:rgba(255,255,255,.075)}
.pg-btn.active{box-shadow:0 0 0 1px rgba(255,255,255,.24),0 0 26px rgba(255,204,0,.24),0 14px 36px rgba(0,0,0,.34)!important}
#modal{background:radial-gradient(circle at 50% 0%,rgba(255,204,0,.075),transparent 30%),radial-gradient(circle at 100% 18%,rgba(255,42,109,.055),transparent 30%),rgba(0,0,0,.94)}
.modal-inner{box-shadow:0 0 100px rgba(0,0,0,.72),inset 0 1px 0 rgba(255,255,255,.035)}
.vid-h1{letter-spacing:.002em}.rel-item:hover .rel-img{transform:scale(1.035)}.rel-img{transition:transform .32s var(--ease)}
.rel-img-w{border-radius:10px}.rel-txt{color:rgba(255,255,255,.82)}

@media(min-width:900px){.cat-bar{margin-top:7px!important;margin-bottom:10px!important}.chip{padding:8px 18px!important;font-size:12px}.grid{gap:17px}.wrap{padding-bottom:30px}}
@media(max-width:600px){.wrap{padding-left:13px;padding-right:13px}.cat-bar{margin:7px 0 10px!important;padding:1px 0 2px!important}.cats{padding:3px 2px 4px!important;gap:6px!important}.chip{min-height:33px;padding:7px 15px!important;font-size:12px}.chip-clear{width:16px;height:16px;font-size:13px;margin-right:-7px}.grid{gap:15px}.card{border-radius:16px}.meta{padding:11px 13px 13px}.ad-card{border-radius:16px}}


/* === Divine polish pass 3: clean category rail + sharper premium controls (style-only) === */
:root{
  --radius-control:13px;
  --radius-control-sm:10px;
  --radius-card:18px;
  --rail-chip-bg:linear-gradient(180deg,rgba(255,255,255,.070),rgba(255,255,255,.030));
  --rail-chip-border:rgba(255,255,255,.085);
}

/* Remove the left/right category rail shadow/fade completely */
.cat-bar::before,
.cat-bar::after{
  display:none!important;
  content:none!important;
  background:none!important;
  box-shadow:none!important;
  opacity:0!important;
}
.cat-bar{
  overflow:visible!important;
  background:transparent!important;
  box-shadow:none!important;
}
.cats{
  mask-image:none!important;
  -webkit-mask-image:none!important;
  background:transparent!important;
  box-shadow:none!important;
  padding-inline:2px!important;
}

/* Slightly sharper category buttons — no full oval */
.chip{
  border-radius:var(--radius-control)!important;
  min-height:34px!important;
  padding:8px 18px!important;
  background:var(--rail-chip-bg)!important;
  border-color:var(--rail-chip-border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.060),0 10px 26px rgba(0,0,0,.13)!important;
}
.chip:hover{
  background:linear-gradient(180deg,rgba(255,255,255,.095),rgba(255,255,255,.040))!important;
  border-color:rgba(255,255,255,.145)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.085),0 14px 34px rgba(0,0,0,.24)!important;
}
.chip.active{
  border-radius:var(--radius-control)!important;
  background:linear-gradient(135deg,#ffe879 0%,var(--accent) 45%,#ffae18 100%)!important;
  border-color:rgba(255,226,104,.78)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.28),0 0 0 4px rgba(255,204,0,.045),0 16px 40px rgba(255,204,0,.17),0 12px 32px rgba(0,0,0,.34)!important;
}
.chip.active::after{
  border-radius:calc(var(--radius-control) - 1px)!important;
}
.chip-clear{
  border-radius:8px!important;
  width:17px!important;
  height:17px!important;
  background:rgba(0,0,0,.18)!important;
}
.chip-clear:hover{
  background:rgba(0,0,0,.27)!important;
}
.cat-arrow{
  border-radius:10px!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 10px 24px rgba(0,0,0,.14)!important;
}

/* Sharper pagination — still soft, but not pill-shaped */
.pg-btn{
  border-radius:var(--radius-control-sm)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.073),rgba(255,255,255,.032))!important;
  border-color:rgba(255,255,255,.080)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.060),0 10px 26px rgba(0,0,0,.16)!important;
}
.pg-btn:hover{
  border-color:rgba(255,255,255,.145)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.085),0 14px 34px rgba(0,0,0,.25)!important;
}
.pg-btn.active{
  border-radius:var(--radius-control-sm)!important;
  background:linear-gradient(135deg,#ffe879,var(--accent) 56%,#f8a600)!important;
  border-color:rgba(255,226,104,.68)!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.22),0 0 24px rgba(255,204,0,.22),0 12px 32px rgba(0,0,0,.34)!important;
}

/* Extra professional visual tuning, no functional changes */
header{
  background:linear-gradient(180deg,rgba(8,10,18,.98),rgba(5,7,15,.96))!important;
}
.logo-link:hover .logo-text{filter:drop-shadow(0 0 16px rgba(255,255,255,.06))}
.logo-hub{border-radius:7px!important}

.wrap{padding-top:1px}
.grid{align-items:start}
.card{
  border-radius:var(--radius-card)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.050),rgba(255,255,255,.018) 45%,rgba(0,0,0,.080)),#0b0f18!important;
  box-shadow:0 18px 50px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.040)!important;
}
.card.visible:hover{
  border-color:rgba(255,255,255,.145)!important;
  box-shadow:0 30px 88px rgba(0,0,0,.56),0 0 0 1px rgba(255,255,255,.095),0 0 38px rgba(255,204,0,.075)!important;
}
.thumb::after{
  background:linear-gradient(180deg,rgba(0,0,0,0) 38%,rgba(0,0,0,.48) 100%),radial-gradient(circle at 50% 44%,rgba(255,255,255,.045),transparent 58%)!important;
}
.meta{
  background:linear-gradient(180deg,rgba(255,255,255,.018),rgba(0,0,0,.060))!important;
}
.title{
  letter-spacing:.002em;
  text-wrap:pretty;
}
.card-tag{
  border-radius:8px!important;
}
.card-tag-hd{
  border-radius:8px!important;
}
.dur{
  border-radius:8px!important;
}
.play-icon{
  border-radius:15px!important;
}

.ad-card{
  border-radius:var(--radius-card)!important;
}
.ad-card a,
.ad-card .ad-link{
  border-radius:calc(var(--radius-card) - min(var(--ad-border-width,2px),8px))!important;
}

/* Modal/player polish */
.close-btn,
.share-btn,
.copy-btn{
  border-radius:12px!important;
}
.rel-item{
  border-radius:13px!important;
}
.rel-img-w{
  border-radius:11px!important;
}
.empty{
  border-radius:17px!important;
}

@media(min-width:900px){
  .cat-bar{margin-top:6px!important;margin-bottom:9px!important;padding-top:0!important;padding-bottom:2px!important}
  .cats{gap:8px!important;scroll-padding-inline:28px!important}
  .chip{border-radius:13px!important;padding:8px 18px!important}
  .pg-btn{border-radius:10px!important}
}
@media(max-width:600px){
  .cat-bar{margin:6px 0 9px!important;padding:0 0 2px!important}
  .cats{gap:6px!important;padding:3px 1px 4px!important;scroll-padding-inline:18px!important}
  .chip{border-radius:12px!important;padding:7px 14px!important}
  .chip-clear{border-radius:7px!important;width:16px!important;height:16px!important}
  .pg-btn{border-radius:10px!important}
  .play-icon{border-radius:14px!important}
}

/* === Final design lock: refined mobile header + last professional polish (style-only) === */
:root{
  --final-surface:rgba(255,255,255,.052);
  --final-surface-2:rgba(255,255,255,.028);
  --final-border:rgba(255,255,255,.090);
  --final-soft:rgba(255,255,255,.62);
}

/* Header: cleaner hierarchy, better mobile tap targets, no crowded mail button */
header{
  background:linear-gradient(180deg,rgba(7,9,17,.985),rgba(4,6,13,.965))!important;
  box-shadow:0 16px 46px rgba(0,0,0,.34),inset 0 -1px 0 rgba(255,255,255,.030)!important;
}
.hdr{gap:10px}
.hdr-right{gap:10px!important}
.logo-text{
  letter-spacing:-.62px!important;
  text-shadow:0 1px 0 rgba(0,0,0,.38),0 12px 30px rgba(0,0,0,.22);
}
.logo-hub{
  box-shadow:0 0 0 1px rgba(0,0,0,.18),0 10px 24px rgba(255,204,0,.15),0 0 26px rgba(255,204,0,.20)!important;
}
.aff-btn,.aff-btn2{
  min-height:35px;
  line-height:1;
  letter-spacing:.005em;
  border-radius:11px!important;
  border:1px solid rgba(255,255,255,.105)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.22),0 0 22px var(--accent-g)!important;
}
.aff-btn2{box-shadow:0 12px 30px rgba(0,0,0,.22),0 0 23px rgba(168,85,247,.30)!important}
.mail-btn{
  min-width:38px;
  min-height:36px;
  margin-left:3px;
  border-radius:12px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.052),rgba(255,255,255,.024))!important;
  border:1px solid rgba(255,255,255,.080)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 10px 24px rgba(0,0,0,.16)!important;
}
.mail-btn svg{width:19px!important;height:19px!important}
.mail-btn:hover{
  color:#fff!important;
  border-color:rgba(255,204,0,.22)!important;
  background:linear-gradient(180deg,rgba(255,204,0,.12),rgba(255,255,255,.030))!important;
}

/* Final surface polish */
main{
  background:
    radial-gradient(circle at 22% -8%,rgba(255,204,0,.070),transparent 25%),
    radial-gradient(circle at 92% 8%,rgba(255,42,109,.046),transparent 28%),
    linear-gradient(180deg,#05070f 0%,#04060d 52%,#03050a 100%)!important;
}
.wrap{padding-bottom:34px!important}
.grid{gap:18px!important}
.card{
  border-radius:19px!important;
  border-color:rgba(255,255,255,.074)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.020) 43%,rgba(0,0,0,.085)),#0a0e17!important;
  box-shadow:0 18px 46px rgba(0,0,0,.33),inset 0 1px 0 rgba(255,255,255,.042)!important;
}
.card.visible:hover{
  transform:translateY(-6px) scale(1.006)!important;
  border-color:rgba(255,255,255,.16)!important;
  box-shadow:0 34px 96px rgba(0,0,0,.58),0 0 0 1px rgba(255,255,255,.10),0 0 42px rgba(255,204,0,.080)!important;
}
.thumb{background:linear-gradient(135deg,#070a12,#0c101b)!important}
.thumb::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 0%,transparent 34%,rgba(255,255,255,.085) 49%,transparent 64%,transparent 100%);
  transform:translateX(-130%);
  transition:transform .78s var(--ease);
  opacity:.58;
}
.card.visible:hover .thumb::before{transform:translateX(130%)}
.thumb::after{
  z-index:1;
  background:linear-gradient(180deg,rgba(0,0,0,0) 34%,rgba(0,0,0,.54) 100%),radial-gradient(circle at 50% 42%,rgba(255,255,255,.050),transparent 58%)!important;
}
.play-over{z-index:2}
.play-icon{
  width:48px!important;
  height:48px!important;
  border-radius:15px!important;
  background:linear-gradient(180deg,rgba(0,0,0,.62),rgba(0,0,0,.40))!important;
  border-color:rgba(255,255,255,.22)!important;
  box-shadow:0 14px 34px rgba(0,0,0,.35),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.meta{padding:12px 14px 14px!important}
.title{font-size:13.6px!important;color:rgba(255,255,255,.955)!important}
.card-tag{
  background:rgba(255,255,255,.046)!important;
  border-color:rgba(255,255,255,.070)!important;
  color:rgba(255,255,255,.50)!important;
}
.card-tag-hd{
  color:var(--accent)!important;
  background:linear-gradient(135deg,rgba(255,204,0,.17),rgba(255,204,0,.055))!important;
  border-color:rgba(255,204,0,.20)!important;
}

/* Category and pagination final edge: sharper, compact, cleaner */
.cat-bar{margin-top:5px!important;margin-bottom:8px!important}
.cats{gap:7px!important}
.chip{
  border-radius:12px!important;
  min-height:34px!important;
  background:linear-gradient(180deg,rgba(255,255,255,.064),rgba(255,255,255,.026))!important;
}
.chip.active{border-radius:12px!important}
.chip-clear{border-radius:7px!important}
.pg-btn{
  height:37px!important;
  min-width:39px!important;
  border-radius:9px!important;
}
.pagination{margin-top:21px!important}

/* Modal / related final polish */
#modal{
  background:radial-gradient(circle at 50% 0%,rgba(255,204,0,.072),transparent 30%),radial-gradient(circle at 94% 14%,rgba(255,42,109,.052),transparent 32%),rgba(0,0,0,.945)!important;
}
.modal-inner{background:linear-gradient(180deg,#04060d,#070912 42%,#03050a)!important}
.rel-sec{background:linear-gradient(180deg,#050711,#03050a)!important}
.rel-item{border-radius:14px!important}
.rel-item:hover{background:rgba(255,255,255,.040)!important}
.rel-img-w{border-radius:12px!important}

/* Mobile header final sizing: slightly larger, still controlled */
@media(max-width:768px){
  body{grid-template-rows:56px 1fr!important}
  header{padding-left:12px!important;padding-right:12px!important}
  .hdr{gap:8px!important}
  .hdr-right{gap:8px!important}
  .logo-text{font-size:19px!important;gap:3px!important;letter-spacing:-.56px!important}
  .logo-hub{font-size:18px!important;padding:2px 7px!important;border-radius:7px!important}
  .aff-btn,.aff-btn2{
    min-height:34px!important;
    font-size:12px!important;
    padding:8px 12px!important;
    border-radius:10px!important;
    max-width:116px;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  .mail-btn{
    min-width:36px!important;
    min-height:34px!important;
    padding:7px!important;
    margin-left:4px!important;
    flex:0 0 auto;
  }
  .mail-btn svg{width:18px!important;height:18px!important}
}
@media(max-width:430px){
  header{padding-left:10px!important;padding-right:10px!important}
  .hdr-right{gap:7px!important}
  .logo-text{font-size:18.5px!important}
  .logo-hub{font-size:17.5px!important;padding:2px 6px!important}
  .aff-btn,.aff-btn2{font-size:11.5px!important;padding:7px 10px!important;max-width:96px!important}
  .mail-btn{min-width:35px!important;margin-left:3px!important}
  .grid{gap:16px!important}
  .card{border-radius:17px!important}
  .ad-card{border-radius:17px!important}
  .meta{padding:11px 13px 13px!important}
}
@media(max-width:365px){
  .hdr{gap:6px!important}
  .hdr-right{gap:6px!important}
  .logo-text{font-size:17px!important}
  .logo-hub{font-size:16px!important;padding:2px 6px!important}
  .aff-btn,.aff-btn2{font-size:10.7px!important;padding:7px 8px!important;max-width:82px!important}
  .mail-btn{min-width:33px!important;min-height:33px!important;margin-left:2px!important}
}
@media(min-width:900px){
  .grid{gap:18px!important}
  .card.visible:hover{transform:translateY(-6px) scale(1.005)!important}
}

/* === Final touch: stronger category + pagination contrast, slightly larger controls === */
:root{
  --control-surface:linear-gradient(180deg,rgba(255,255,255,.125),rgba(255,255,255,.052));
  --control-surface-hover:linear-gradient(180deg,rgba(255,255,255,.165),rgba(255,255,255,.070));
  --control-border-strong:rgba(255,255,255,.155);
  --control-border-hover:rgba(255,255,255,.235);
  --control-text-strong:rgba(255,255,255,.78);
}

/* Category rail: no side fade, higher readability, still sharp-not-oval */
.cat-bar{
  margin-top:6px!important;
  margin-bottom:10px!important;
  padding-top:1px!important;
  padding-bottom:3px!important;
}
.cats{
  gap:9px!important;
  padding:4px 2px 5px!important;
}
.chip{
  min-height:38px!important;
  padding:9px 20px!important;
  border-radius:13px!important;
  font-size:13.2px!important;
  font-weight:720!important;
  color:var(--control-text-strong)!important;
  background:var(--control-surface)!important;
  border-color:var(--control-border-strong)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.095),
    inset 0 -1px 0 rgba(0,0,0,.20),
    0 12px 30px rgba(0,0,0,.24)!important;
}
.chip:hover{
  color:rgba(255,255,255,.94)!important;
  background:var(--control-surface-hover)!important;
  border-color:var(--control-border-hover)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 16px 38px rgba(0,0,0,.34)!important;
}
.chip.active{
  min-height:39px!important;
  border-radius:13px!important;
  color:#090806!important;
  border-color:rgba(255,232,126,.90)!important;
  background:linear-gradient(135deg,#fff0a3 0%,#ffd21f 42%,#ffad18 100%)!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.32),
    0 0 0 5px rgba(255,204,0,.060),
    0 18px 46px rgba(255,204,0,.20),
    0 14px 34px rgba(0,0,0,.36)!important;
}
.chip.active::after{border-radius:12px!important;opacity:.24!important}
.chip-clear{
  width:18px!important;
  height:18px!important;
  border-radius:8px!important;
  margin-right:-8px!important;
  background:rgba(0,0,0,.20)!important;
}

/* Pagination: stronger surface so it does not disappear into the page background */
.pagination{margin-top:23px!important;gap:9px!important}
.pg-btn{
  min-width:42px!important;
  height:40px!important;
  padding:0 14px!important;
  border-radius:10px!important;
  font-size:12.4px!important;
  font-weight:780!important;
  color:rgba(255,255,255,.80)!important;
  background:var(--control-surface)!important;
  border-color:var(--control-border-strong)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.095),
    inset 0 -1px 0 rgba(0,0,0,.20),
    0 12px 30px rgba(0,0,0,.24)!important;
}
.pg-btn:hover{
  color:#fff!important;
  background:var(--control-surface-hover)!important;
  border-color:var(--control-border-hover)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 16px 38px rgba(0,0,0,.34)!important;
}
.pg-btn.active{
  color:#090806!important;
  border-radius:10px!important;
  border-color:rgba(255,232,126,.82)!important;
  background:linear-gradient(135deg,#fff0a3 0%,#ffd21f 52%,#ffad18 100%)!important;
  box-shadow:
    0 0 0 1px rgba(255,255,255,.28),
    0 0 28px rgba(255,204,0,.26),
    0 14px 36px rgba(0,0,0,.36)!important;
}
.pg-dots{color:rgba(255,255,255,.46)!important}

/* Extra surface polish — style-only */
.card,
.ad-card{
  border-color:rgba(255,255,255,.070)!important;
}
.card.visible:hover{
  border-color:rgba(255,255,255,.18)!important;
  box-shadow:
    0 36px 100px rgba(0,0,0,.62),
    0 0 0 1px rgba(255,255,255,.11),
    0 0 46px rgba(255,204,0,.095)!important;
}
.meta{
  background:linear-gradient(180deg,rgba(13,16,24,.985),rgba(8,10,17,.995))!important;
}
.card-tag{
  color:rgba(255,255,255,.56)!important;
  border-color:rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.052)!important;
}
.card-tag-hd{
  color:#ffd21f!important;
  border-color:rgba(255,204,0,.25)!important;
  background:linear-gradient(135deg,rgba(255,204,0,.20),rgba(255,204,0,.065))!important;
}

@media(min-width:900px){
  .chip{min-height:38px!important;padding:9px 21px!important;font-size:13px!important}
  .pg-btn{height:40px!important;min-width:42px!important}
}
@media(max-width:600px){
  .cat-bar{margin-top:7px!important;margin-bottom:10px!important}
  .cats{gap:7px!important;padding:4px 1px 5px!important}
  .chip{min-height:36px!important;padding:8px 16px!important;font-size:12.4px!important;border-radius:12px!important}
  .chip.active{min-height:37px!important;border-radius:12px!important}
  .chip-clear{width:17px!important;height:17px!important;border-radius:7px!important}
  .pagination{gap:7px!important;margin-top:21px!important}
  .pg-btn{height:38px!important;min-width:40px!important;border-radius:10px!important;padding:0 12px!important}
}

/* === Ultimate premium professional pass: restrained controls + final visual polish === */
:root{
  --control-surface:linear-gradient(180deg,rgba(17,23,36,.96),rgba(10,14,24,.98))!important;
  --control-surface-hover:linear-gradient(180deg,rgba(24,32,49,.98),rgba(13,18,31,.99))!important;
  --control-border-strong:rgba(148,163,184,.165)!important;
  --control-border-hover:rgba(203,213,225,.28)!important;
  --control-text-strong:rgba(226,232,240,.78)!important;
  --premium-line:rgba(255,204,0,.18);
  --premium-line-hover:rgba(255,204,0,.30);
  --premium-shadow:0 14px 34px rgba(0,0,0,.32);
}
body{
  background:
    radial-gradient(900px 360px at 50% -170px,rgba(255,204,0,.045),transparent 68%),
    radial-gradient(720px 320px at 15% -90px,rgba(120,119,198,.045),transparent 62%),
    linear-gradient(180deg,#060812 0%,#05070f 48%,#04060d 100%)!important;
}
header{
  background:linear-gradient(180deg,rgba(8,11,19,.985),rgba(5,7,15,.97))!important;
  border-bottom-color:rgba(148,163,184,.10)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.24)!important;
}
.wrap{padding-top:0!important}
.cat-bar{
  margin-top:6px!important;
  margin-bottom:10px!important;
  padding:1px 0 2px!important;
}
.cats{
  gap:8px!important;
  padding:4px 2px 5px!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
}
.chip{
  min-height:37px!important;
  padding:8px 19px!important;
  border-radius:11px!important;
  font-size:13px!important;
  line-height:1!important;
  font-weight:720!important;
  letter-spacing:.01em!important;
  color:var(--control-text-strong)!important;
  background:var(--control-surface)!important;
  border:1px solid var(--control-border-strong)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 0 rgba(0,0,0,.28),
    var(--premium-shadow)!important;
}
.chip::before{
  content:'';
  position:absolute;
  left:12px;
  right:12px;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--premium-line),transparent);
  opacity:.75;
  pointer-events:none;
}
.chip:hover{
  color:rgba(248,250,252,.94)!important;
  background:var(--control-surface-hover)!important;
  border-color:var(--control-border-hover)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.24),
    0 16px 38px rgba(0,0,0,.40)!important;
}
.chip:hover::before{background:linear-gradient(90deg,transparent,var(--premium-line-hover),transparent);opacity:1}
.chip.active{
  min-height:38px!important;
  border-radius:11px!important;
  color:#11100b!important;
  background:linear-gradient(135deg,#f7df82 0%,#f0c735 45%,#c99010 100%)!important;
  border-color:rgba(255,226,134,.72)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(103,70,0,.22),
    0 0 0 1px rgba(255,255,255,.12),
    0 10px 26px rgba(240,199,53,.13),
    0 16px 36px rgba(0,0,0,.38)!important;
}
.chip.active::before{display:none!important}
.chip.active::after{
  border-radius:10px!important;
  opacity:.16!important;
}
.chip-clear{
  width:17px!important;
  height:17px!important;
  margin-right:-8px!important;
  border-radius:6px!important;
  background:rgba(17,16,11,.20)!important;
  color:#17130a!important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important;
}
.chip-clear:hover{background:rgba(17,16,11,.30)!important}
.cat-arrow{
  width:27px!important;
  height:27px!important;
  border-radius:9px!important;
  color:rgba(226,232,240,.52)!important;
  background:linear-gradient(180deg,rgba(17,23,36,.95),rgba(9,13,22,.98))!important;
  border-color:rgba(148,163,184,.14)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 12px 28px rgba(0,0,0,.26)!important;
}
.cat-arrow:hover{
  color:#f0c735!important;
  background:linear-gradient(180deg,rgba(24,32,49,.98),rgba(13,18,31,.99))!important;
  border-color:rgba(240,199,53,.22)!important;
}
.pagination{
  margin-top:22px!important;
  gap:8px!important;
  padding-top:2px!important;
}
.pg-btn{
  min-width:41px!important;
  height:39px!important;
  padding:0 13px!important;
  border-radius:9px!important;
  font-size:12.3px!important;
  font-weight:760!important;
  letter-spacing:.01em!important;
  color:rgba(226,232,240,.74)!important;
  background:var(--control-surface)!important;
  border:1px solid var(--control-border-strong)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    inset 0 -1px 0 rgba(0,0,0,.28),
    0 12px 28px rgba(0,0,0,.30)!important;
}
.pg-btn:hover{
  color:rgba(248,250,252,.94)!important;
  background:var(--control-surface-hover)!important;
  border-color:var(--control-border-hover)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(0,0,0,.24),
    0 15px 34px rgba(0,0,0,.38)!important;
}
.pg-btn.active{
  color:#11100b!important;
  border-radius:9px!important;
  background:linear-gradient(135deg,#f7df82 0%,#f0c735 50%,#c99010 100%)!important;
  border-color:rgba(255,226,134,.70)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -1px 0 rgba(103,70,0,.22),
    0 0 0 1px rgba(255,255,255,.10),
    0 10px 26px rgba(240,199,53,.13),
    0 14px 34px rgba(0,0,0,.38)!important;
}
.pg-dots{color:rgba(148,163,184,.62)!important}
.card{
  background:linear-gradient(180deg,rgba(16,21,32,.985),rgba(9,12,20,.995))!important;
  border-color:rgba(148,163,184,.095)!important;
  box-shadow:0 10px 28px rgba(0,0,0,.20)!important;
}
.card::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}
.card.visible:hover{
  border-color:rgba(203,213,225,.18)!important;
  transform:translateY(-5px) scale(1.003)!important;
  box-shadow:
    0 30px 78px rgba(0,0,0,.58),
    0 0 0 1px rgba(255,255,255,.06),
    0 0 34px rgba(240,199,53,.055)!important;
}
.thumb::before{
  background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0) 34%,rgba(0,0,0,.22) 100%)!important;
}
.meta{
  background:linear-gradient(180deg,rgba(12,16,26,.99),rgba(8,11,18,1))!important;
  border-top:1px solid rgba(255,255,255,.035)!important;
}
.title{
  color:rgba(248,250,252,.95)!important;
  font-weight:660!important;
  letter-spacing:.002em!important;
}
.card-tag{
  border-radius:6px!important;
  color:rgba(203,213,225,.62)!important;
  background:rgba(15,23,42,.68)!important;
  border-color:rgba(148,163,184,.105)!important;
}
.card-tag-hd{
  color:#f0c735!important;
  background:rgba(240,199,53,.10)!important;
  border-color:rgba(240,199,53,.20)!important;
}
.play-icon{
  background:rgba(3,7,18,.58)!important;
  border-color:rgba(226,232,240,.20)!important;
  box-shadow:0 16px 34px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.card.visible:hover .play-icon{
  border-color:rgba(240,199,53,.35)!important;
  box-shadow:0 18px 42px rgba(0,0,0,.42),0 0 22px rgba(240,199,53,.12),inset 0 1px 0 rgba(255,255,255,.10)!important;
}
.dur{
  background:rgba(3,7,18,.72)!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:6px!important;
}
.ad-card{
  box-shadow:0 18px 48px rgba(0,0,0,.40),0 0 22px rgba(18,247,232,.075)!important;
}
.vmodal{
  background:rgba(3,6,14,.88)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
}
.box,
.player-wrap{
  border-color:rgba(148,163,184,.12)!important;
  box-shadow:0 36px 110px rgba(0,0,0,.60)!important;
}
@media(min-width:900px){
  .chip{min-height:37px!important;padding:8px 20px!important;font-size:12.9px!important}
  .pg-btn{height:39px!important;min-width:41px!important}
}
@media(max-width:600px){
  .cat-bar{margin-top:6px!important;margin-bottom:9px!important}
  .cats{gap:7px!important;padding:4px 1px!important}
  .chip{min-height:35px!important;padding:8px 15px!important;border-radius:10px!important;font-size:12.2px!important}
  .chip.active{min-height:36px!important;border-radius:10px!important}
  .chip-clear{width:16px!important;height:16px!important;border-radius:6px!important}
  .pagination{gap:7px!important;margin-top:20px!important}
  .pg-btn{height:37px!important;min-width:39px!important;border-radius:9px!important;padding:0 11px!important}
}


/* === Elegant final control system: modern, quiet, premium (style-only) === */
:root{
  --elegant-ink:rgba(238,242,248,.84);
  --elegant-ink-soft:rgba(206,216,230,.68);
  --elegant-bg:rgba(13,18,29,.64);
  --elegant-bg-2:rgba(18,24,38,.72);
  --elegant-bg-hover:rgba(25,32,48,.82);
  --elegant-border:rgba(197,211,230,.118);
  --elegant-border-hover:rgba(222,231,244,.20);
  --elegant-gold:#e8c663;
  --elegant-gold-soft:rgba(232,198,99,.32);
  --elegant-gold-faint:rgba(232,198,99,.085);
  --elegant-radius:12px;
  --elegant-radius-sm:10px;
}

/* Overall balance: less flashy, more editorial/premium */
body{
  background:
    radial-gradient(780px 310px at 50% -150px,rgba(232,198,99,.038),transparent 70%),
    radial-gradient(680px 280px at 12% -80px,rgba(115,138,202,.032),transparent 62%),
    radial-gradient(720px 280px at 92% 2%,rgba(18,247,232,.025),transparent 60%),
    linear-gradient(180deg,#060813 0%,#050711 48%,#04060d 100%)!important;
}
body::before{opacity:.18!important;background-size:56px 56px!important}
header{
  background:rgba(6,9,17,.82)!important;
  backdrop-filter:blur(18px) saturate(1.02)!important;
  -webkit-backdrop-filter:blur(18px) saturate(1.02)!important;
  border-bottom:1px solid rgba(197,211,230,.075)!important;
  box-shadow:0 12px 34px rgba(0,0,0,.23)!important;
}
header::after{opacity:.45!important;background:linear-gradient(90deg,transparent,rgba(232,198,99,.18),rgba(197,211,230,.06),transparent)!important}

/* Category rail: remove decorative edge artefacts and make controls elegant */
.cat-bar{
  margin-top:6px!important;
  margin-bottom:10px!important;
  padding:1px 0 2px!important;
  background:transparent!important;
  box-shadow:none!important;
}
.cat-bar::before,.cat-bar::after{display:none!important;content:none!important;opacity:0!important;background:none!important;box-shadow:none!important}
.cats{
  gap:8px!important;
  padding:4px 2px 5px!important;
  mask-image:none!important;
  -webkit-mask-image:none!important;
  background:transparent!important;
  box-shadow:none!important;
  scroll-padding-inline:32px!important;
}
.chip{
  position:relative!important;
  min-height:37px!important;
  padding:8px 18px!important;
  border-radius:var(--elegant-radius)!important;
  font-size:12.9px!important;
  font-weight:680!important;
  letter-spacing:.004em!important;
  line-height:1!important;
  color:var(--elegant-ink-soft)!important;
  background:linear-gradient(180deg,var(--elegant-bg-2),var(--elegant-bg))!important;
  border:1px solid var(--elegant-border)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 8px 18px rgba(0,0,0,.18)!important;
  transform:none!important;
}
.chip::before{display:none!important;content:none!important}
.chip:hover{
  color:var(--elegant-ink)!important;
  background:linear-gradient(180deg,var(--elegant-bg-hover),rgba(15,21,34,.86))!important;
  border-color:var(--elegant-border-hover)!important;
  transform:translateY(-1px)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.060),
    0 10px 22px rgba(0,0,0,.24)!important;
}
.chip.active{
  min-height:38px!important;
  padding:8px 19px!important;
  border-radius:var(--elegant-radius)!important;
  color:#f4d986!important;
  background:
    linear-gradient(180deg,rgba(232,198,99,.105),rgba(232,198,99,.040)),
    linear-gradient(180deg,rgba(22,27,39,.95),rgba(11,16,27,.98))!important;
  border-color:rgba(232,198,99,.46)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.070),
    inset 0 0 0 1px rgba(232,198,99,.045),
    0 0 0 1px rgba(232,198,99,.070),
    0 10px 26px rgba(0,0,0,.30),
    0 0 24px rgba(232,198,99,.070)!important;
  transform:translateY(-1px)!important;
}
.chip.active::after{
  content:''!important;
  display:block!important;
  position:absolute!important;
  left:12px!important;
  right:12px!important;
  bottom:5px!important;
  top:auto!important;
  height:1px!important;
  border-radius:1px!important;
  background:linear-gradient(90deg,transparent,rgba(232,198,99,.70),transparent)!important;
  opacity:.70!important;
  pointer-events:none!important;
  inset:auto 12px 5px 12px!important;
}
.chip-clear{
  width:17px!important;
  height:17px!important;
  margin-right:-7px!important;
  border-radius:7px!important;
  color:#f4d986!important;
  background:rgba(232,198,99,.105)!important;
  box-shadow:inset 0 0 0 1px rgba(232,198,99,.13)!important;
}
.chip-clear:hover{
  color:#0a0d14!important;
  background:#e8c663!important;
  box-shadow:0 6px 16px rgba(232,198,99,.16)!important;
}
.cat-arrow{
  width:27px!important;
  height:27px!important;
  border-radius:10px!important;
  color:rgba(206,216,230,.58)!important;
  background:linear-gradient(180deg,rgba(18,24,38,.72),rgba(11,16,27,.80))!important;
  border:1px solid rgba(197,211,230,.105)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.040),0 8px 18px rgba(0,0,0,.20)!important;
}
.cat-arrow:hover{
  color:#e8c663!important;
  border-color:rgba(232,198,99,.28)!important;
  background:linear-gradient(180deg,rgba(25,32,48,.86),rgba(14,20,32,.88))!important;
}

/* Pagination: same elegant language, compact and modern */
.pagination{
  margin-top:22px!important;
  gap:8px!important;
  padding-top:2px!important;
}
.pg-btn{
  min-width:40px!important;
  height:38px!important;
  padding:0 13px!important;
  border-radius:var(--elegant-radius-sm)!important;
  font-size:12.2px!important;
  font-weight:690!important;
  letter-spacing:.004em!important;
  color:var(--elegant-ink-soft)!important;
  background:linear-gradient(180deg,var(--elegant-bg-2),var(--elegant-bg))!important;
  border:1px solid var(--elegant-border)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.045),0 8px 18px rgba(0,0,0,.18)!important;
}
.pg-btn:hover{
  color:var(--elegant-ink)!important;
  background:linear-gradient(180deg,var(--elegant-bg-hover),rgba(15,21,34,.86))!important;
  border-color:var(--elegant-border-hover)!important;
  transform:translateY(-1px)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.060),0 10px 22px rgba(0,0,0,.24)!important;
}
.pg-btn.active{
  color:#f4d986!important;
  border-radius:var(--elegant-radius-sm)!important;
  background:
    linear-gradient(180deg,rgba(232,198,99,.105),rgba(232,198,99,.040)),
    linear-gradient(180deg,rgba(22,27,39,.95),rgba(11,16,27,.98))!important;
  border-color:rgba(232,198,99,.44)!important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.070),
    0 0 0 1px rgba(232,198,99,.065),
    0 10px 24px rgba(0,0,0,.28),
    0 0 20px rgba(232,198,99,.065)!important;
}
.pg-btn.disabled{opacity:.34!important}
.pg-dots{color:rgba(206,216,230,.44)!important}

/* More refined surfaces without touching behavior */
.card{
  border-radius:18px!important;
  background:linear-gradient(180deg,rgba(15,21,33,.98),rgba(8,12,20,.995))!important;
  border-color:rgba(197,211,230,.082)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.035)!important;
}
.card.visible:hover{
  transform:translateY(-4px) scale(1.002)!important;
  border-color:rgba(232,198,99,.18)!important;
  box-shadow:0 28px 70px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.045),0 0 32px rgba(232,198,99,.045)!important;
}
.thumb::before{opacity:.78!important;background:linear-gradient(180deg,rgba(255,255,255,.038),rgba(255,255,255,0) 36%,rgba(0,0,0,.28) 100%)!important}
.thumb::after{opacity:.88!important;background:linear-gradient(180deg,rgba(0,0,0,0) 48%,rgba(0,0,0,.42) 100%)!important}
.meta{background:linear-gradient(180deg,rgba(10,14,23,.99),rgba(7,10,17,1))!important;border-top:1px solid rgba(197,211,230,.055)!important}
.title{font-weight:640!important;color:rgba(248,250,252,.94)!important;letter-spacing:0!important}
.card-tag{border-radius:7px!important;color:rgba(206,216,230,.62)!important;background:rgba(16,23,36,.62)!important;border-color:rgba(197,211,230,.095)!important}
.card-tag-hd{color:#e8c663!important;background:rgba(232,198,99,.085)!important;border-color:rgba(232,198,99,.18)!important}
.play-icon{border-radius:14px!important;background:rgba(5,8,15,.58)!important;border-color:rgba(238,242,248,.18)!important;box-shadow:0 14px 30px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08)!important}
.card.visible:hover .play-icon{border-color:rgba(232,198,99,.34)!important;box-shadow:0 16px 36px rgba(0,0,0,.38),0 0 20px rgba(232,198,99,.10),inset 0 1px 0 rgba(255,255,255,.10)!important}
.dur{border-radius:7px!important;background:rgba(5,8,15,.70)!important;border-color:rgba(197,211,230,.090)!important}
.ad-card{box-shadow:0 18px 48px rgba(0,0,0,.38),0 0 20px rgba(18,247,232,.055)!important}
.rel-item:hover{background:rgba(255,255,255,.025)!important;border-color:rgba(232,198,99,.12)!important}

@media(min-width:900px){
  .chip{min-height:37px!important;padding:8px 19px!important;font-size:12.8px!important}
  .chip.active{min-height:38px!important}
  .pg-btn{height:38px!important;min-width:40px!important}
}
@media(max-width:600px){
  .cat-bar{margin-top:6px!important;margin-bottom:9px!important;padding-bottom:1px!important}
  .cats{gap:7px!important;padding:4px 1px!important;scroll-padding-inline:18px!important}
  .chip{min-height:35px!important;padding:8px 14px!important;border-radius:10px!important;font-size:12.15px!important}
  .chip.active{min-height:36px!important;border-radius:10px!important}
  .chip.active::after{left:10px!important;right:10px!important;bottom:4px!important;inset:auto 10px 4px 10px!important}
  .chip-clear{width:16px!important;height:16px!important;border-radius:6px!important;margin-right:-6px!important}
  .pagination{gap:7px!important;margin-top:20px!important}
  .pg-btn{height:37px!important;min-width:38px!important;border-radius:9px!important;padding:0 11px!important;font-size:12px!important}
}


/* More elegant public controls */
.cat,.pg button,.pb{border-radius:12px!important;background:linear-gradient(180deg,rgba(17,24,39,.76),rgba(5,10,21,.84))!important;border:1px solid rgba(148,163,184,.16)!important;color:rgba(226,232,240,.82)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 8px 22px rgba(0,0,0,.18)!important}.cat:hover,.pg button:hover,.pb:hover{color:#f8fafc!important;border-color:rgba(203,213,225,.32)!important;background:linear-gradient(180deg,rgba(30,41,59,.76),rgba(15,23,42,.88))!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 12px 28px rgba(0,0,0,.22)!important}.cat.on,.pg button.on,.pb.on{background:linear-gradient(180deg,rgba(245,158,11,.16),rgba(15,23,42,.86))!important;color:#fde68a!important;border-color:rgba(245,158,11,.42)!important;box-shadow:0 12px 28px rgba(245,158,11,.08),inset 0 1px 0 rgba(255,255,255,.10)!important}.cat.on:after{background:linear-gradient(90deg,transparent,rgba(251,191,36,.92),transparent)!important;height:2px!important}.card{background:linear-gradient(180deg,rgba(15,23,42,.80),rgba(2,6,23,.94))!important;border:1px solid rgba(148,163,184,.11)!important;box-shadow:0 18px 40px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045)!important}.card:hover{border-color:rgba(226,232,240,.20)!important;box-shadow:0 24px 58px rgba(0,0,0,.36),0 0 0 1px rgba(250,204,21,.05),inset 0 1px 0 rgba(255,255,255,.07)!important}.thumb:before{background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 34%,rgba(0,0,0,.28))!important}.vtitle{letter-spacing:.005em}.tag{background:rgba(15,23,42,.64)!important;border-color:rgba(148,163,184,.14)!important;color:rgba(226,232,240,.74)!important}.hd{background:rgba(245,158,11,.12)!important;border-color:rgba(245,158,11,.28)!important;color:#facc15!important}
@media(max-width:700px){.cat{font-size:12px!important;padding:9px 12px!important}.pg button,.pb{min-width:36px!important;height:34px!important}}


/* === No-CF final: speed + elegant frontend polish (style-only) === */
:root{
  --no-cf-gold:#e9c96d;
  --no-cf-gold-2:#b98a28;
  --no-cf-ink:rgba(235,241,249,.86);
  --no-cf-ink-soft:rgba(198,209,224,.66);
  --no-cf-panel:rgba(12,17,28,.74);
  --no-cf-panel-2:rgba(18,24,38,.74);
  --no-cf-line:rgba(200,214,235,.105);
  --no-cf-line-hi:rgba(232,198,99,.34);
}
html{scrollbar-gutter:stable}
body{
  background:
    radial-gradient(760px 290px at 50% -170px,rgba(233,201,109,.034),transparent 72%),
    radial-gradient(680px 260px at 12% -80px,rgba(116,139,203,.030),transparent 64%),
    radial-gradient(660px 260px at 96% 0%,rgba(18,247,232,.019),transparent 62%),
    linear-gradient(180deg,#050713 0%,#040711 46%,#03050b 100%)!important;
}
header{background:rgba(5,8,16,.84)!important;border-bottom-color:rgba(200,214,235,.072)!important;box-shadow:0 14px 38px rgba(0,0,0,.25)!important}
header::after{opacity:.38!important;background:linear-gradient(90deg,transparent,rgba(233,201,109,.14),rgba(200,214,235,.045),transparent)!important}
.wrap{padding-top:1px!important;padding-bottom:34px!important}
.cat-bar{margin-top:6px!important;margin-bottom:9px!important;padding:1px 0 2px!important}
.cats{gap:8px!important;padding:4px 2px 5px!important;mask-image:none!important;-webkit-mask-image:none!important;scroll-padding-inline:34px!important}
.cat-bar::before,.cat-bar::after{display:none!important;content:none!important;background:none!important;box-shadow:none!important}
.chip{
  min-height:36px!important;
  padding:8px 17px!important;
  border-radius:11px!important;
  font-size:12.85px!important;
  font-weight:680!important;
  letter-spacing:.002em!important;
  color:var(--no-cf-ink-soft)!important;
  background:linear-gradient(180deg,var(--no-cf-panel-2),var(--no-cf-panel))!important;
  border:1px solid var(--no-cf-line)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.040),0 7px 18px rgba(0,0,0,.18)!important;
  transform:none!important;
}
.chip:hover{color:var(--no-cf-ink)!important;background:linear-gradient(180deg,rgba(24,31,47,.82),rgba(13,18,30,.84))!important;border-color:rgba(222,231,244,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 10px 24px rgba(0,0,0,.24)!important;transform:translateY(-1px)!important}
.chip.active{
  color:var(--no-cf-gold)!important;
  background:linear-gradient(180deg,rgba(233,201,109,.115),rgba(233,201,109,.040)),linear-gradient(180deg,rgba(20,26,40,.97),rgba(9,14,24,.99))!important;
  border-color:rgba(233,201,109,.44)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.064),0 0 0 1px rgba(233,201,109,.060),0 10px 26px rgba(0,0,0,.30),0 0 22px rgba(233,201,109,.065)!important;
}
.chip.active::after{left:12px!important;right:12px!important;bottom:5px!important;height:1px!important;background:linear-gradient(90deg,transparent,rgba(233,201,109,.68),transparent)!important;opacity:.72!important;border-radius:1px!important}
.chip-clear{width:17px!important;height:17px!important;border-radius:7px!important;margin-right:-7px!important;background:rgba(233,201,109,.10)!important;color:var(--no-cf-gold)!important;box-shadow:inset 0 0 0 1px rgba(233,201,109,.13)!important}
.chip-clear:hover{background:var(--no-cf-gold)!important;color:#090b10!important;box-shadow:0 6px 16px rgba(233,201,109,.16)!important}
.cat-arrow{width:27px!important;height:27px!important;border-radius:10px!important;background:linear-gradient(180deg,rgba(18,24,38,.70),rgba(9,13,22,.78))!important;border-color:var(--no-cf-line)!important;color:rgba(198,209,224,.54)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 8px 18px rgba(0,0,0,.20)!important}
.cat-arrow:hover{color:var(--no-cf-gold)!important;border-color:rgba(233,201,109,.25)!important;background:linear-gradient(180deg,rgba(24,31,47,.86),rgba(14,20,32,.88))!important}
.grid{gap:18px!important}
.card{border-radius:18px!important;background:linear-gradient(180deg,rgba(15,21,33,.98),rgba(8,12,20,.995))!important;border-color:rgba(200,214,235,.080)!important;box-shadow:0 12px 30px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.034)!important;transform:translateZ(0)}
.card.visible:hover{transform:translateY(-4px) scale(1.002)!important;border-color:rgba(233,201,109,.17)!important;box-shadow:0 28px 70px rgba(0,0,0,.52),0 0 0 1px rgba(255,255,255,.045),0 0 32px rgba(233,201,109,.045)!important}
.thumb{background:#070b13!important}
.thumb img{image-rendering:auto;will-change:transform}
.thumb::before{opacity:.72!important;background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0) 36%,rgba(0,0,0,.26) 100%)!important}
.thumb::after{opacity:.82!important;background:linear-gradient(180deg,rgba(0,0,0,0) 48%,rgba(0,0,0,.40) 100%)!important}
.meta{background:linear-gradient(180deg,rgba(10,14,23,.99),rgba(7,10,17,1))!important;border-top:1px solid rgba(200,214,235,.052)!important}
.title{color:rgba(248,250,252,.94)!important;font-weight:640!important;letter-spacing:0!important;text-wrap:pretty}
.card-tag{border-radius:7px!important;color:rgba(198,209,224,.62)!important;background:rgba(16,23,36,.62)!important;border-color:rgba(200,214,235,.094)!important}
.card-tag-hd{color:var(--no-cf-gold)!important;background:rgba(233,201,109,.084)!important;border-color:rgba(233,201,109,.18)!important}
.play-icon{border-radius:14px!important;background:rgba(5,8,15,.58)!important;border-color:rgba(238,242,248,.18)!important;box-shadow:0 14px 30px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.08)!important}
.card.visible:hover .play-icon{border-color:rgba(233,201,109,.32)!important;box-shadow:0 16px 36px rgba(0,0,0,.38),0 0 20px rgba(233,201,109,.10),inset 0 1px 0 rgba(255,255,255,.10)!important}
.dur{border-radius:7px!important;background:rgba(5,8,15,.70)!important;border-color:rgba(200,214,235,.090)!important}
.ad-card{box-shadow:0 18px 48px rgba(0,0,0,.38),0 0 20px rgba(18,247,232,.052)!important;transform:translateZ(0)}
.pagination{margin-top:22px!important;gap:8px!important;padding-top:2px!important}
.pg-btn{min-width:40px!important;height:38px!important;padding:0 13px!important;border-radius:10px!important;font-size:12.2px!important;font-weight:690!important;color:var(--no-cf-ink-soft)!important;background:linear-gradient(180deg,var(--no-cf-panel-2),var(--no-cf-panel))!important;border:1px solid var(--no-cf-line)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.040),0 8px 18px rgba(0,0,0,.18)!important}
.pg-btn:hover{color:var(--no-cf-ink)!important;background:linear-gradient(180deg,rgba(24,31,47,.82),rgba(13,18,30,.84))!important;border-color:rgba(222,231,244,.18)!important;transform:translateY(-1px)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 10px 24px rgba(0,0,0,.24)!important}
.pg-btn.active{color:var(--no-cf-gold)!important;background:linear-gradient(180deg,rgba(233,201,109,.112),rgba(233,201,109,.040)),linear-gradient(180deg,rgba(20,26,40,.97),rgba(9,14,24,.99))!important;border-color:rgba(233,201,109,.42)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.064),0 0 0 1px rgba(233,201,109,.060),0 10px 24px rgba(0,0,0,.28),0 0 20px rgba(233,201,109,.060)!important}
.pg-btn.disabled{opacity:.34!important}.pg-dots{color:rgba(198,209,224,.44)!important}
.rel-item:hover{background:rgba(255,255,255,.025)!important;border-color:rgba(233,201,109,.12)!important}
@media(min-width:900px){.chip{min-height:37px!important;padding:8px 19px!important;font-size:12.8px!important}.chip.active{min-height:38px!important}.pg-btn{height:38px!important;min-width:40px!important}}
@media(max-width:600px){.cat-bar{margin-top:6px!important;margin-bottom:9px!important;padding-bottom:1px!important}.cats{gap:7px!important;padding:4px 1px!important;scroll-padding-inline:18px!important}.chip{min-height:35px!important;padding:8px 14px!important;border-radius:10px!important;font-size:12.15px!important}.chip.active{min-height:36px!important;border-radius:10px!important}.chip.active::after{left:10px!important;right:10px!important;bottom:4px!important}.chip-clear{width:16px!important;height:16px!important;border-radius:6px!important;margin-right:-6px!important}.pagination{gap:7px!important;margin-top:20px!important}.pg-btn{height:37px!important;min-width:38px!important;border-radius:9px!important;padding:0 11px!important;font-size:12px!important}.card.visible:hover{transform:none!important}}
@media(prefers-reduced-motion:reduce){.thumb img,.card,.ad-card,.chip,.pg-btn,.play-icon{will-change:auto!important}}