/**
 * DarkTube Theme - YavrumSakin Modern Dark Header
 * Reference: image1 (header), image2 (mobile menu), image3 (models page)
 */

/* ==========================================================================
   Variables
   ========================================================================== */
   :root {
    --dt-bg: #0d1117;
    --dt-bg-card: #161b22;
    --dt-bg-light: #1c2128;
    --dt-white: #ffffff;
    --dt-orange: #ff6b00;
    --dt-orange-dark: #e05e00;
    --dt-red: #e63946;
    --dt-blue: #2a7ab5;
    --dt-text: #c9d1d9;
    --dt-text-light: #8b949e;
    --dt-text-muted: #6e7681;
    --dt-border: #30363d;
    --dt-border-light: #21262d;
    --dt-container: 1100px;
    --dt-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --dt-radius: 8px;
    --dt-radius-sm: 5px;
    --dt-shadow: 0 1px 3px rgba(0,0,0,0.2);
    --dt-shadow-hover: 0 4px 12px rgba(0,0,0,0.3);
    --dt-transition: 0.2s ease;
}

/* ==========================================================================
   Reset & Base
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{font-size:14px;scroll-behavior:smooth}
body{
    font-family:var(--dt-font);
    background:var(--dt-bg);
    color:var(--dt-text);
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
}
a{color:var(--dt-text);text-decoration:none;transition:color var(--dt-transition)}
a:hover{color:var(--dt-orange)}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
input,select,textarea{font-family:inherit;font-size:inherit}

/* ==========================================================================
   Layout
   ========================================================================== */
.dt-container{max-width:var(--dt-container);margin:0 auto;padding:0 16px}
.dt-layout{display:flex;gap:24px;margin-top:16px}
.dt-layout--sidebar .dt-main{flex:1;min-width:0}
.dt-layout--sidebar .dt-sidebar{width:260px;flex-shrink:0}
.dt-layout:not(.dt-layout--sidebar){display:block}

/* ==========================================================================
   HEADER - Dark gradient bar with inline nav (reference image1)
   ========================================================================== */
.dt-header{
    background:linear-gradient(180deg,#1c1c1c 0%,#111 60%,#0a0a0a 100%);
    border-bottom:2px solid var(--dt-orange);
    padding:0;
}
.dt-header__inner{
    display:flex;
    align-items:center;
    gap:0;
    height:58px;
}
.dt-header__logo{flex-shrink:0;margin-right:8px}
.dt-header__logo a{display:flex;align-items:center}
.dt-header__logo img{max-height:42px;width:auto}
.dt-header__logo-text{
    font-size:1.5rem;
    font-weight:900;
    color:var(--dt-orange);
    line-height:1;
    letter-spacing:-0.5px;
}
.dt-header__logo-text span{color:#fff}

/* Desktop Nav */
.dt-header__nav{
    display:flex;
    align-items:center;
    gap:0;
    margin-left:12px;
}
.dt-header__nav-link{
    display:flex;align-items:center;gap:5px;
    padding:0 16px;
    height:58px;
    font-size:0.84rem;
    font-weight:700;
    color:#ccc;
    white-space:nowrap;
    transition:all var(--dt-transition);
    letter-spacing:0.3px;
    text-transform:uppercase;
}
.dt-header__nav-link:hover,
.dt-header__nav-link--active{
    color:var(--dt-orange);
}
.dt-header__nav-link svg{opacity:0.6}
.dt-header__nav-link:hover svg{opacity:1}

/* Dropdown */
.dt-header__dropdown{position:relative}
.dt-header__dropdown-menu{
    display:none;
    position:absolute;top:100%;left:0;
    min-width:200px;
    background:#1a1a1a;
    border:1px solid var(--dt-border);
    border-radius:0 0 var(--dt-radius) var(--dt-radius);
    box-shadow:0 8px 24px rgba(0,0,0,0.5);
    z-index:100;
    padding:6px 0;
}
.dt-header__dropdown:hover .dt-header__dropdown-menu{display:block}
.dt-header__dropdown-menu a{
    display:block;
    padding:8px 16px;
    font-size:0.82rem;
    color:#bbb;
    transition:all var(--dt-transition);
}
.dt-header__dropdown-menu a:hover{
    background:var(--dt-orange);
    color:#fff;
}

/* Search */
.dt-header__search{
    flex-shrink:0;
    width:200px;
    margin-left:auto;
}
.dt-search-inline{
    display:flex;
    border-radius:4px;
    overflow:hidden;
    background:#2a2a2a;
    border:1px solid #444;
}
.dt-search-inline input{
    flex:1;
    border:none;
    padding:7px 10px;
    font-size:0.82rem;
    color:#ddd;
    background:transparent;
    outline:none;
    min-width:0;
}
.dt-search-inline input::placeholder{color:#666}
.dt-search-inline button{
    width:36px;
    background:#3a3a3a;
    display:flex;align-items:center;justify-content:center;
    color:#999;
    transition:all var(--dt-transition);
    border-left:1px solid #444;
}
.dt-search-inline button:hover{background:var(--dt-orange);color:#fff}

.dt-mobile-toggle{display:none;width:40px;height:40px;align-items:center;justify-content:center;color:#fff;flex-shrink:0;order:3}
.dt-mobile-search-btn{display:none;width:40px;height:40px;align-items:center;justify-content:center;color:#ccc;flex-shrink:0;order:2;transition:color var(--dt-transition)}
.dt-mobile-search-btn:hover{color:var(--dt-orange)}

/* Mobile Search Dropdown */
.dt-mobile-search-dropdown{
    display:none;
    background:#1a1a1a;
    border-bottom:1px solid var(--dt-border);
    padding:10px 0;
}
.dt-mobile-search-dropdown.is-open{display:block}

/* Logo img */
.dt-header__logo-img{max-height:32px;width:auto}

/* ==========================================================================
   STORIES - ROUNDED circles (Instagram style) with touch scroll
   ========================================================================== */
.dt-stories{
    background:var(--dt-bg);
    padding:12px 0;
    overflow:visible;
    position:relative;
    /* Allow track to escape container padding */
    margin-left:-16px;
    margin-right:-16px;
    padding-left:16px;
    padding-right:16px;
}
.dt-stories__label{
    display:flex;align-items:center;gap:8px;
    margin-bottom:10px;
    padding:0 2px;
}
.dt-stories__label-logo{
    height:22px;width:auto;
}
.dt-stories__label span{
    font-size:0.88rem;
    font-weight:800;
    color:var(--dt-orange);
    text-transform:uppercase;
    letter-spacing:0.5px;
}
.dt-stories__track{
    display:flex;
    gap:8px;
    overflow-x:scroll;
    overflow-y:hidden;
    scrollbar-width:none;
    padding:4px 16px;
    margin:0 -16px;
    -webkit-overflow-scrolling:touch;
}
.dt-stories__track::-webkit-scrollbar{display:none}

.dt-stories__item{
    position:relative;
    flex:0 0 auto;
    width:68px;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:4px;
    cursor:pointer;
    text-decoration:none;
    color:inherit;
    transition:transform var(--dt-transition);
}
.dt-stories__item:hover{transform:translateY(-2px)}

.dt-stories__ring{
    width:72px;height:72px;
    border-radius:50%;
    padding:3px;
    background:linear-gradient(135deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888);
    transition:box-shadow var(--dt-transition);
}
.dt-stories__item:hover .dt-stories__ring{
    box-shadow:0 4px 16px rgba(255,107,0,0.4);
}
.dt-stories__img{
    width:100%;height:100%;
    border-radius:50%;
    border:3px solid var(--dt-bg);
    overflow:hidden;
    background:#333;
}
.dt-stories__img img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.dt-stories__placeholder{
    width:100%;height:100%;
    border-radius:50%;
    border:3px solid var(--dt-bg);
    background:linear-gradient(135deg,var(--dt-orange),var(--dt-orange-dark));
    display:flex;align-items:center;justify-content:center;
    color:#fff;font-size:1.2rem;font-weight:800;
}
.dt-stories__name{
    font-size:0.7rem;
    color:var(--dt-text-light);
    text-align:center;
    max-width:76px;
    overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
    font-weight:500;
}
.dt-stories__item:hover .dt-stories__name{color:var(--dt-orange)}

/* ==========================================================================
   VIDEO CARD - Dark theme cards
   ========================================================================== */
.dt-card{
    background:transparent;
    margin-bottom:4px;
    transition:transform var(--dt-transition);
}
.dt-card:hover{transform:translateY(-2px)}
.dt-card__thumb{
    position:relative;
    display:block;
    overflow:hidden;
    background:#222;
    border-radius:var(--dt-radius);
}
.dt-card__thumb img{
    width:100%;
    display:block;
    border-radius:var(--dt-radius);
    transition:transform 0.3s ease;
}
.dt-card:hover .dt-card__thumb img{transform:scale(1.03)}
.dt-card__duration{
    position:absolute;bottom:6px;right:6px;
    background:rgba(0,0,0,0.78);color:#fff;
    font-size:0.72rem;font-weight:700;
    padding:2px 6px;border-radius:3px;
}
.dt-card__overlay{display:none}
.dt-card__play{display:none}

.dt-card{min-width:0;overflow:hidden}
.dt-card__body{padding:8px 2px 0;min-width:0;overflow:hidden}
.dt-card__category{display:none}

.dt-card__title{
    font-size:0.88rem;
    font-weight:500;
    line-height:1.4;
    color:var(--dt-text);
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;
    overflow:hidden;
    margin-bottom:4px;
}
.dt-card__title a{color:var(--dt-text)}
.dt-card__title a:hover{color:var(--dt-orange)}

.dt-card__meta{
    display:flex;align-items:center;
    gap:10px;
    font-size:0.76rem;
    color:var(--dt-text-muted);
}
.dt-card__meta-item{display:flex;align-items:center;gap:3px}
.dt-card__meta-item svg{width:12px;height:12px;flex-shrink:0;opacity:0.5}
a.dt-card__meta-model{color:var(--dt-orange);font-weight:600;text-decoration:none;transition:color .2s}
a.dt-card__meta-model:hover{color:#fff;text-decoration:underline}
.dt-card__meta-model svg{opacity:0.8}

/* Model Special Video */
.dt-card--model-special{
    border:2px solid transparent;
    border-image:linear-gradient(135deg,#ff6b00,#e63946,#cc2366,#bc1888) 1;
    border-radius:var(--dt-radius);
    overflow:hidden;
}
.dt-card--model-special .dt-card__thumb{
    border-radius:calc(var(--dt-radius) - 2px) calc(var(--dt-radius) - 2px) 0 0;
}
.dt-card--model-special .dt-card__thumb img{
    border-radius:calc(var(--dt-radius) - 2px) calc(var(--dt-radius) - 2px) 0 0;
}
.dt-card__model-badge{
    position:absolute;top:6px;left:6px;
    background:linear-gradient(135deg,#ff6b00,#e63946);
    color:#fff;
    font-size:0.62rem;
    font-weight:800;
    padding:2px 8px;
    border-radius:3px;
    display:flex;align-items:center;gap:3px;
    text-transform:uppercase;
    letter-spacing:0.3px;
    z-index:2;
    backdrop-filter:blur(4px);
}

/* ==========================================================================
   BLOG CARD
   ========================================================================== */
.dt-blog-card{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    overflow:hidden;margin-bottom:8px;
    box-shadow:var(--dt-shadow);
    transition:transform var(--dt-transition),box-shadow var(--dt-transition);
}
.dt-blog-card:hover{transform:translateY(-2px);box-shadow:var(--dt-shadow-hover)}
.dt-blog-card__thumb{overflow:hidden;background:#222;position:relative;display:block}
.dt-blog-card__visual{
    width:100%;aspect-ratio:16/9;
    background:linear-gradient(135deg,#ff6b00 0%,#e63946 40%,#cc2366 70%,#bc1888 100%);
    display:flex;align-items:center;justify-content:center;
    transition:transform 0.3s ease;
}
.dt-blog-card:hover .dt-blog-card__visual{transform:scale(1.03)}
.dt-blog-card__visual-text{
    font-size:1.6rem;font-weight:900;color:#fff;
    letter-spacing:6px;text-transform:uppercase;
    text-shadow:0 2px 8px rgba(0,0,0,0.3);
    opacity:0.9;
}
.dt-blog-card__body{padding:12px}
.dt-blog-card__category{font-size:0.7rem;font-weight:700;color:var(--dt-orange);display:inline-block;margin-bottom:3px}
.dt-blog-card__title{
    font-size:0.88rem;font-weight:600;line-height:1.35;margin-bottom:4px;color:var(--dt-text);
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.dt-blog-card__title a{color:var(--dt-text)}
.dt-blog-card__title a:hover{color:var(--dt-orange)}
.dt-blog-card__excerpt{
    font-size:0.78rem;color:var(--dt-text-light);line-height:1.4;
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    margin-bottom:4px;
}
.dt-blog-card__meta{font-size:0.72rem;color:var(--dt-text-muted);display:flex;gap:8px}

/* Video Single - Model + Description Container */
.dt-video-info{
    display:flex;align-items:center;gap:0;
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    padding:12px 14px;margin-bottom:12px;
    box-shadow:var(--dt-shadow);
}
.dt-video-info__left{
    display:flex;align-items:center;gap:8px;
    flex-shrink:0;white-space:nowrap;
}
.dt-video-info__left:hover strong{color:var(--dt-orange)}
.dt-video-model__avatar{
    width:36px;height:36px;border-radius:50%;flex-shrink:0;
    overflow:hidden;border:2px solid var(--dt-orange);
    background:var(--dt-orange);
    display:flex;align-items:center;justify-content:center;
}
.dt-video-model__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.dt-video-model__avatar span{color:#fff;font-weight:900;font-size:0.85rem}
.dt-video-info__left strong{font-size:0.85rem;font-weight:700;color:var(--dt-text)}
.dt-video-info__badge{font-size:0.68rem;color:var(--dt-text-muted)}
.dt-video-info__divider{
    width:1px;align-self:stretch;
    background:var(--dt-border);
    margin:0 14px;flex-shrink:0;
}
.dt-video-info__desc{
    flex:1;min-width:0;
    font-size:0.82rem;color:var(--dt-text-light);line-height:1.5;
}
.dt-video-info__desc p{margin:0}

/* ==========================================================================
   GRID - 2 columns
   ========================================================================== */
.dt-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:18px;
}
.dt-grid--blog{grid-template-columns:repeat(2,1fr)}

/* ==========================================================================
   Section
   ========================================================================== */
.dt-section{margin:8px 0}
.dt-section__header{
    display:flex;align-items:center;justify-content:space-between;
    margin-bottom:10px;
}
.dt-section__title{
    font-size:0.95rem;
    font-weight:700;
    text-transform:uppercase;
    color:var(--dt-text);
    letter-spacing:0.3px;
}
.dt-section__title svg{display:none}
.dt-section__link{display:none}

/* ==========================================================================
   SIDEBAR - Dark theme
   ========================================================================== */
.dt-sidebar{
    width:100%;
    position:sticky;
    top:16px;
    align-self:flex-start;
}
.widget{
    background:var(--dt-bg-card);
    padding:14px;
    margin-bottom:14px;
    border-radius:var(--dt-radius);
    box-shadow:var(--dt-shadow);
}
.widget-title{
    font-size:0.82rem;font-weight:700;
    margin-bottom:10px;padding-bottom:6px;
    border-bottom:2px solid var(--dt-orange);
    text-transform:uppercase;color:var(--dt-text);
    letter-spacing:0.3px;
}

/* 2-column category list */
.dt-category-list{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:0 8px;
}
.dt-category-list li{
    border-bottom:1px solid var(--dt-border-light);
}
.dt-category-list a{
    display:block;
    padding:5px 0;
    font-size:0.8rem;
    color:var(--dt-orange);
    white-space:nowrap;
    overflow:hidden;text-overflow:ellipsis;
    transition:color var(--dt-transition);
}
.dt-category-list a:hover{color:#fff}
.dt-category-list a::before{
    content:'+ ';
    color:var(--dt-orange);
    font-weight:700;
}
.dt-category-list .count{display:none}

/* Trending sidebar */
.dt-trending-item{
    display:flex;gap:10px;
    padding:8px 0;
    border-bottom:1px solid var(--dt-border-light);
}
.dt-trending-item:last-child{border-bottom:none}
.dt-trending-item__thumb{
    width:85px;flex-shrink:0;
    border-radius:var(--dt-radius-sm);
    overflow:hidden;background:#222;
}
.dt-trending-item__thumb img{width:100%;height:100%;object-fit:cover}
.dt-trending-item__info{flex:1;min-width:0}
.dt-trending-item__title{
    font-size:0.75rem;font-weight:600;line-height:1.35;color:var(--dt-text);
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    margin-bottom:3px;
}
.dt-trending-item__title a{color:var(--dt-text)}
.dt-trending-item__title a:hover{color:var(--dt-orange)}
.dt-trending-item__model{font-size:0.66rem;font-weight:700;color:var(--dt-orange);display:block;margin-bottom:1px}
.dt-trending-item__meta{font-size:0.68rem;color:var(--dt-text-muted)}

.dt-sidebar-ad{
    background:var(--dt-bg-card);padding:12px;margin-bottom:14px;text-align:center;
    border-radius:var(--dt-radius);box-shadow:var(--dt-shadow);
}

/* Partner Widget */
.dt-partner-list{display:flex;flex-direction:column;gap:0}
.dt-partner-item{
    display:flex;align-items:center;gap:10px;
    padding:8px 0;
    border-bottom:1px solid var(--dt-border-light);
    transition:all var(--dt-transition);
}
.dt-partner-item:last-child{border-bottom:none}
.dt-partner-item:hover{padding-left:4px}
.dt-partner-item__avatar{
    width:36px;height:36px;border-radius:50%;flex-shrink:0;
    overflow:hidden;background:var(--dt-orange);
    display:flex;align-items:center;justify-content:center;
    border:2px solid var(--dt-orange);
}
.dt-partner-item__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.dt-partner-item__avatar span{color:#fff;font-weight:800;font-size:0.82rem}
.dt-partner-item__name{font-size:0.82rem;font-weight:700;color:var(--dt-text)}
.dt-partner-item:hover .dt-partner-item__name{color:var(--dt-orange)}
.dt-partner-item__count{font-size:0.68rem;color:var(--dt-text-muted)}
.dt-partner-see-all{
    display:block;text-align:center;
    margin-top:10px;padding:8px;
    background:var(--dt-bg-light);
    border-radius:var(--dt-radius-sm);
    font-size:0.78rem;font-weight:700;
    color:var(--dt-orange);
    transition:all var(--dt-transition);
}
.dt-partner-see-all:hover{background:var(--dt-orange);color:#fff}

/* ==========================================================================
   REELS VIEWER - Instagram/TikTok style vertical card
   ========================================================================== */
.reels{
    display:none;
    position:fixed;inset:0;
    z-index:9999;
    align-items:center;justify-content:center;
}
.reels.is-open{display:flex}
.reels__backdrop{
    position:absolute;inset:0;
    background:rgba(0,0,0,0.95);
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.reels__close{
    position:absolute;top:16px;right:16px;z-index:10;
    width:40px;height:40px;border-radius:50%;
    background:rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    transition:background 0.2s;
}
.reels__close:hover{background:rgba(255,255,255,0.25)}
.reels__nav{
    position:absolute;top:50%;z-index:10;
    width:44px;height:44px;border-radius:50%;
    background:rgba(255,255,255,0.1);
    display:flex;align-items:center;justify-content:center;
    transform:translateY(-50%);
    transition:background 0.2s;
}
.reels__nav:hover{background:var(--dt-orange)}
.reels__prev{left:max(16px,calc(50% - 210px))}
.reels__next{right:max(16px,calc(50% - 210px))}

/* The tall card */
.reels__card{
    position:relative;z-index:5;
    width:340px;
    height:min(88vh,640px);
    border-radius:16px;
    overflow:hidden;
    background:#000;
    box-shadow:0 16px 64px rgba(0,0,0,0.8);
}
.reels__card--enter{animation:reelsIn 0.3s ease}
.reels__card--next{animation:reelsNext 0.3s ease forwards}
.reels__card--prev{animation:reelsPrev 0.3s ease forwards}
@keyframes reelsIn{from{opacity:0;transform:scale(0.9) translateY(20px)}to{opacity:1;transform:none}}
@keyframes reelsNext{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:none}}
@keyframes reelsPrev{from{opacity:0;transform:translateX(-60px)}to{opacity:1;transform:none}}

/* Visual area fills the entire card */
.reels__visual{
    position:absolute;inset:0;
    display:flex;align-items:center;justify-content:center;
    background:#111;
}
.reels__visual img,
.reels__visual video,
.reels-video{
    width:100%;height:100%;object-fit:cover;
    display:block;
}
.reels__visual .reels-loading{
    color:#555;font-size:0.82rem;
}

/* Overlay gradient at bottom */
.reels__overlay{
    position:absolute;bottom:0;left:0;right:0;
    padding:60px 16px 16px;
    background:linear-gradient(transparent 0%,rgba(0,0,0,0.7) 40%,rgba(0,0,0,0.92) 100%);
    z-index:2;
}
.reels__model-row{
    display:flex;align-items:center;gap:10px;
    margin-bottom:8px;
}
.reels__avatar{
    width:40px;height:40px;border-radius:50%;flex-shrink:0;
    overflow:hidden;border:2px solid var(--dt-orange);
    background:var(--dt-orange);
    display:flex;align-items:center;justify-content:center;
}
.reels__avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.reels__avatar span{color:#fff;font-weight:900;font-size:1rem}
.reels__name{
    font-size:0.95rem;font-weight:800;color:#fff;
    text-shadow:0 1px 4px rgba(0,0,0,0.6);
}
.reels__stats{
    font-size:0.72rem;color:rgba(255,255,255,0.7);
}
.reels__bio{
    font-size:0.78rem;color:rgba(255,255,255,0.8);
    line-height:1.35;margin-bottom:10px;
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.reels__btn{
    display:flex;align-items:center;justify-content:center;gap:8px;
    flex:1;padding:11px 16px;
    background:var(--dt-orange);color:#fff;
    border-radius:8px;
    font-size:0.84rem;font-weight:700;
    transition:background 0.2s;
}
.reels__btn:hover{background:#e05e00;color:#fff}

/* Progress bars */
.reels__progress{
    position:absolute;top:0;left:0;right:0;z-index:10;
    padding:12px 10px 8px;
    background:linear-gradient(to bottom, rgba(0,0,0,0.6), transparent);
}
.reels__progress-bars{
    display:flex;gap:4px;
}
.reels__progress-bar{
    flex:1;height:3px;background:rgba(255,255,255,0.3);
    border-radius:2px;overflow:hidden;
}
.reels__progress-fill{
    height:100%;width:0;
    background:#fff;
    border-radius:2px;
    transition:width 0.05s linear;
}

/* Video element */
.reels__video{
    position:absolute;inset:0;
    width:100%;height:100%;
    object-fit:cover;
    background:#000;
}

/* Actions row */
.reels__actions{
    display:flex;align-items:center;gap:10px;
}

/* Sound button */
.reels__sound-btn{
    width:44px;height:44px;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,0.15);
    border-radius:50%;
    color:#fff;
    transition:background 0.2s;
    flex-shrink:0;
}
.reels__sound-btn:hover{background:rgba(255,255,255,0.25)}
.reels__sound-btn svg{width:20px;height:20px}

/* Story ring with gradient for has-story */
.dt-stories__ring--has-story{
    background:linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
    padding:3px;
}
.dt-stories__ring--has-story .dt-stories__img,
.dt-stories__ring--has-story .dt-stories__placeholder{
    border:2px solid var(--dt-bg);
}

/* Story count badge */
.dt-stories__count{
    position:absolute;top:2px;right:2px;
    min-width:16px;height:16px;
    display:flex;align-items:center;justify-content:center;
    background:var(--dt-orange);
    color:#fff;font-size:0.6rem;font-weight:700;
    border-radius:8px;padding:0 4px;
    box-shadow:0 1px 3px rgba(0,0,0,0.3);
}

/* Responsive */
@media(max-width:480px){
    .reels__card{width:100vw;height:100vh;border-radius:0}
    .reels__close{top:12px;right:12px}
    .reels__prev{left:6px}
    .reels__next{right:6px}
    .reels__nav{width:36px;height:36px;background:rgba(255,255,255,0.15)}
    .reels__progress{padding:8px 8px 6px}
    .reels__sound-btn{width:38px;height:38px}
}

/* ==========================================================================
   Video Player (Single)
   ========================================================================== */
.dt-player{margin-bottom:12px}
.dt-player__wrapper{
    position:relative;padding-top:56.25%;
    background:#000;border-radius:var(--dt-radius);overflow:hidden;
}
.dt-player__wrapper iframe,
.dt-player__wrapper video{position:absolute;top:0;left:0;width:100%;height:100%}
.dt-player__placeholder{
    aspect-ratio:16/9;background:#1a1a1a;border-radius:var(--dt-radius);
    display:flex;align-items:center;justify-content:center;color:#555;
}
.dt-player__thumbnail{transition:all 0.3s}
.dt-player__thumbnail:hover .dt-play-btn{transform:scale(1.15);background:rgba(255,107,0,1)}
.dt-below-player-ad{margin:10px 0;text-align:center}

/* ==========================================================================
   Single Video Meta
   ========================================================================== */
.dt-single-meta{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    padding:16px;margin-bottom:12px;box-shadow:var(--dt-shadow);
}
.dt-single-meta__title{font-size:1.15rem;font-weight:700;line-height:1.3;margin-bottom:8px;color:var(--dt-text)}
.dt-single-meta__info{
    display:flex;flex-wrap:wrap;align-items:center;
    gap:12px;font-size:0.82rem;color:var(--dt-text-light);
    margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid var(--dt-border-light);
}
.dt-single-meta__info-item{display:flex;align-items:center;gap:4px}
.dt-single-meta__info-item svg{width:14px;height:14px;color:var(--dt-text-muted)}
.dt-single-meta__info-item a{color:var(--dt-orange)}
.dt-single-meta__actions{display:flex;gap:8px;margin-bottom:10px}
.dt-like-btn,.dt-dislike-btn{
    display:flex;align-items:center;gap:4px;
    padding:6px 14px;border-radius:var(--dt-radius-sm);
    background:var(--dt-bg-light);font-size:0.82rem;font-weight:600;
    color:var(--dt-text-light);border:1px solid var(--dt-border);
    transition:all var(--dt-transition);
}
.dt-like-btn:hover,.dt-like-btn.active{background:#1a3a1a;color:#4caf50;border-color:#4caf50}
.dt-dislike-btn:hover,.dt-dislike-btn.active{background:#3a1a1a;color:#ef5350;border-color:#ef5350}
.dt-like-btn svg,.dt-dislike-btn svg{width:14px;height:14px}
.dt-single-meta__tags{display:flex;flex-wrap:wrap;gap:4px}
.dt-tag{
    display:inline-block;padding:3px 10px;
    background:var(--dt-bg-light);border:1px solid var(--dt-border);
    border-radius:20px;font-size:0.72rem;color:var(--dt-text-light);
    transition:all var(--dt-transition);
}
.dt-tag:hover{background:var(--dt-orange);color:#fff;border-color:var(--dt-orange)}
.dt-description{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    padding:16px;margin-bottom:12px;line-height:1.7;
    color:var(--dt-text-light);font-size:0.88rem;
    box-shadow:var(--dt-shadow);
}
.dt-description h2,.dt-description h3{color:var(--dt-text);margin:12px 0 6px}
.dt-description p{margin-bottom:8px}
.dt-description a{color:var(--dt-orange)}
.dt-show-more{
    display:block;width:100%;text-align:center;padding:10px;
    background:var(--dt-bg-card);border:1px solid var(--dt-border);border-radius:var(--dt-radius-sm);
    font-size:0.88rem;font-weight:600;color:var(--dt-text);cursor:pointer;
    margin-bottom:12px;transition:all var(--dt-transition);
}
.dt-show-more:hover{background:var(--dt-bg-light);border-color:var(--dt-orange)}

/* ==========================================================================
   Single Blog
   ========================================================================== */
.dt-single-blog{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    overflow:hidden;margin-bottom:12px;box-shadow:var(--dt-shadow);
}
.dt-single-blog__thumb{overflow:hidden;background:#222}
.dt-single-blog__thumb img{width:100%;display:block}
.dt-single-blog__content{padding:20px}
.dt-single-blog__title{font-size:1.4rem;font-weight:700;line-height:1.3;margin-bottom:10px;color:var(--dt-text)}
.dt-single-blog__meta{
    display:flex;flex-wrap:wrap;gap:10px;font-size:0.82rem;color:var(--dt-text-light);
    margin-bottom:14px;padding-bottom:12px;border-bottom:1px solid var(--dt-border-light);
}
.dt-single-blog__body{line-height:1.8;font-size:0.95rem;color:var(--dt-text-light)}
.dt-single-blog__body h2,.dt-single-blog__body h3{color:var(--dt-text);margin:16px 0 8px}
.dt-single-blog__body p{margin-bottom:12px}
.dt-single-blog__body a{color:var(--dt-orange)}
.dt-single-blog__body img{border-radius:var(--dt-radius);margin:12px 0}
.dt-single-blog__body blockquote{
    border-left:3px solid var(--dt-orange);padding:8px 16px;margin:12px 0;
    background:var(--dt-bg-light);border-radius:0 var(--dt-radius-sm) var(--dt-radius-sm) 0;
    color:var(--dt-text);font-style:italic;
}

/* ==========================================================================
   Comments
   ========================================================================== */
.dt-comments{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    padding:16px;margin-bottom:12px;box-shadow:var(--dt-shadow);
}
.dt-comments__title{font-size:1rem;font-weight:700;margin-bottom:12px;color:var(--dt-text)}
.comment-list{list-style:none}
.comment{padding:10px 0;border-bottom:1px solid var(--dt-border-light)}
.comment:last-child{border-bottom:none}
.comment .comment-author{display:flex;align-items:center;gap:6px;margin-bottom:3px}
.comment .comment-author img{border-radius:50%;width:28px;height:28px}
.comment .comment-author .fn{font-weight:600;font-size:0.82rem;color:var(--dt-text)}
.comment .comment-metadata{font-size:0.68rem;color:var(--dt-text-muted);margin-bottom:4px}
.comment .comment-metadata a{color:var(--dt-text-muted)}
.comment .comment-content{font-size:0.82rem;color:var(--dt-text-light);line-height:1.5}
.comment .reply a{font-size:0.72rem;color:var(--dt-orange);font-weight:500}
.children{list-style:none;padding-left:20px}
.comment-respond{margin-top:12px;padding-top:12px;border-top:1px solid var(--dt-border-light)}
.comment-respond .comment-reply-title{font-size:0.95rem;font-weight:700;margin-bottom:8px;color:var(--dt-text)}
.comment-form label{display:block;font-size:0.78rem;font-weight:600;margin-bottom:3px;color:var(--dt-text-light)}
.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea{
    width:100%;background:var(--dt-bg-light);border:1px solid var(--dt-border);
    border-radius:var(--dt-radius-sm);color:var(--dt-text);
    padding:8px 12px;margin-bottom:8px;transition:border-color var(--dt-transition);
}
.comment-form input:focus,.comment-form textarea:focus{outline:none;border-color:var(--dt-orange)}
.comment-form textarea{min-height:80px;resize:vertical}
.comment-form .form-submit input{
    background:var(--dt-orange);color:#fff;border:none;
    padding:9px 22px;border-radius:var(--dt-radius-sm);font-weight:700;cursor:pointer;
    transition:background var(--dt-transition);
}
.comment-form .form-submit input:hover{background:var(--dt-orange-dark)}
.comment-form .comment-notes,.comment-form .logged-in-as{font-size:0.72rem;color:var(--dt-text-muted);margin-bottom:8px}

/* ==========================================================================
   Pagination
   ========================================================================== */
.dt-pagination{
    margin:18px 0;text-align:center;
    background:var(--dt-bg-card);padding:14px;border-radius:var(--dt-radius);
    box-shadow:var(--dt-shadow);
}
.dt-pagination__info{font-size:0.82rem;color:var(--dt-text-light);margin-bottom:8px}
.dt-pagination ul{display:inline-flex;gap:3px;list-style:none}
.dt-pagination li a,
.dt-pagination li span{
    display:flex;align-items:center;justify-content:center;
    min-width:32px;height:32px;padding:0 8px;
    font-size:0.85rem;font-weight:600;border-radius:var(--dt-radius-sm);
    color:var(--dt-text);background:var(--dt-bg-light);border:1px solid var(--dt-border);
    transition:all var(--dt-transition);
}
.dt-pagination li a:hover{background:var(--dt-orange);color:#fff;border-color:var(--dt-orange)}
.dt-pagination li .current{background:var(--dt-orange);color:#fff;border-color:var(--dt-orange)}

/* ==========================================================================
   Page Header
   ========================================================================== */
.dt-page-header{
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    padding:14px;margin-bottom:14px;box-shadow:var(--dt-shadow);
}
.dt-page-header__title{font-size:1rem;font-weight:700;text-transform:uppercase;color:var(--dt-orange)}
.dt-page-header__desc{font-size:0.82rem;color:var(--dt-text-light)}

/* ==========================================================================
   Footer - Dark theme
   ========================================================================== */
/* Footer Blog Section */
.dt-footer-blog{
    background:var(--dt-bg-light);
    padding:16px 0;
    border-top:1px solid var(--dt-border);
}
.dt-footer-blog__title{
    font-size:0.88rem;font-weight:800;color:var(--dt-text);
    margin-bottom:10px;padding-bottom:6px;
    border-bottom:2px solid var(--dt-orange);
}
.dt-footer-blog__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
.dt-footer-blog__item{
    display:flex;gap:10px;align-items:center;
    background:var(--dt-bg-card);border-radius:var(--dt-radius);
    overflow:hidden;transition:transform var(--dt-transition);
}
.dt-footer-blog__item:hover{transform:translateY(-2px)}
.dt-footer-blog__visual{
    width:80px;height:60px;flex-shrink:0;
    background:linear-gradient(135deg,#ff6b00,#e63946,#cc2366);
    display:flex;align-items:center;justify-content:center;
}
.dt-footer-blog__visual span{
    font-size:0.7rem;font-weight:900;color:#fff;letter-spacing:3px;
}
.dt-footer-blog__info{padding:8px 10px 8px 0;min-width:0}
.dt-footer-blog__info strong{
    display:block;font-size:0.78rem;color:var(--dt-text);line-height:1.3;
    display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
    margin-bottom:2px;
}
.dt-footer-blog__item:hover .dt-footer-blog__info strong{color:var(--dt-orange)}
.dt-footer-blog__info span{font-size:0.66rem;color:var(--dt-text-muted)}
@media(max-width:480px){
    .dt-footer-blog__grid{grid-template-columns:1fr}
    .dt-footer-blog__visual{width:60px;height:50px}
    .dt-footer-blog__info strong{font-size:0.72rem}
}

.dt-footer{
    background:var(--dt-bg-card);
    margin-top:20px;padding:16px 0;
    border-top:1px solid var(--dt-border);
}
.dt-footer__links{
    display:flex;flex-wrap:wrap;justify-content:center;
    gap:6px;margin-bottom:12px;
    padding-bottom:12px;border-bottom:1px solid var(--dt-border-light);
}
.dt-footer__links a{
    font-size:0.85rem;font-weight:700;color:var(--dt-text);padding:0 6px;
    transition:color var(--dt-transition);
}
.dt-footer__links a:hover{color:var(--dt-orange)}
.dt-footer__links span{color:var(--dt-border);font-weight:400}
.dt-footer__seo{
    font-size:0.78rem;line-height:1.6;color:var(--dt-text-light);
    text-align:center;margin-bottom:12px;max-width:900px;margin-left:auto;margin-right:auto;
}
.dt-footer__copy{
    text-align:center;font-size:0.78rem;color:var(--dt-text-muted);
}
.dt-footer__copy .heart{color:var(--dt-orange)}
.dt-footer__inner{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px}
.dt-footer__nav ul{display:flex;gap:10px}
.dt-footer__nav a{font-size:0.78rem;color:var(--dt-text-light)}
.dt-footer__nav a:hover{color:var(--dt-orange)}

/* ==========================================================================
   MOBILE MENU - Dark sidebar (reference image2)
   ========================================================================== */
.dt-mobile-menu{
    display:none;position:fixed;top:0;left:0;width:300px;height:100vh;
    background:linear-gradient(180deg,#1a1e24 0%,#12161c 100%);
    z-index:200;transform:translateX(-100%);transition:transform 0.3s ease;
    overflow-y:auto;padding:0;
    box-shadow:4px 0 30px rgba(0,0,0,0.4);
}
.dt-mobile-menu.is-open{transform:translateX(0)}
.dt-mobile-overlay{
    display:none;position:fixed;top:0;left:0;width:100%;height:100%;
    background:rgba(0,0,0,0.6);z-index:199;opacity:0;transition:opacity 0.3s ease;
}
.dt-mobile-overlay.is-open{opacity:1}

.dt-mobile-menu__header{
    display:flex;align-items:center;gap:10px;
    padding:16px 20px;
}
.dt-mobile-menu__title{
    font-size:1.1rem;font-weight:900;color:var(--dt-orange);
    flex:1;letter-spacing:1px;
}
.dt-mobile-menu__close{
    display:flex;align-items:center;justify-content:center;
    width:30px;height:30px;color:#888;
    transition:color var(--dt-transition);
}
.dt-mobile-menu__close:hover{color:#fff}
.dt-mobile-menu__divider{
    height:1px;
    background:linear-gradient(90deg,transparent,var(--dt-border),transparent);
    margin:0 16px;
}
.dt-mobile-menu__nav{
    padding:8px 0;
}
.dt-mobile-menu__nav li{list-style:none}
.dt-mobile-menu__nav a{
    display:flex;align-items:center;gap:12px;
    padding:14px 20px;
    font-size:0.95rem;
    font-weight:700;
    color:#ccc;
    transition:all var(--dt-transition);
}
.dt-mobile-menu__nav a:hover{color:var(--dt-orange);background:rgba(255,107,0,0.05)}
.dt-mobile-menu__nav a svg{color:var(--dt-orange);flex-shrink:0}

.dt-mobile-menu__section-title{
    display:flex;align-items:center;gap:8px;
    padding:12px 20px 8px;
    font-size:0.82rem;
    font-weight:800;
    color:var(--dt-orange);
    text-transform:uppercase;
    letter-spacing:0.5px;
}
.dt-mobile-menu__cats{padding:0 0 12px}
.dt-mobile-menu__cats li{list-style:none}
.dt-mobile-menu__cats a{
    display:block;
    padding:8px 20px;
    font-size:0.88rem;
    color:#999;
    transition:all var(--dt-transition);
}
.dt-mobile-menu__cats a:hover{color:var(--dt-orange);padding-left:24px}
.dt-mobile-menu__search{
    padding:12px 20px;
    border-top:1px solid var(--dt-border-light);
}

/* ==========================================================================
   MODEL ARCHIVE PAGE - Grid with cards (reference image3)
   ========================================================================== */
.dt-model-grid{
    display:grid;
    grid-template-columns:repeat(5,1fr);
    gap:16px;
}
.dt-model-card{
    background:var(--dt-bg-card);
    border-radius:var(--dt-radius);
    overflow:hidden;
    transition:transform var(--dt-transition),box-shadow var(--dt-transition);
    position:relative;
}
.dt-model-card:hover{transform:translateY(-3px);box-shadow:var(--dt-shadow-hover)}
.dt-model-card__thumb{
    display:block;
    position:relative;
    aspect-ratio:3/4;
    overflow:hidden;
    background:linear-gradient(135deg,#1a1a1a 0%,#2a2a2a 100%);
}
.dt-model-card__thumb img{
    width:100%;height:100%;object-fit:cover;
    transition:transform 0.3s ease;
}
.dt-model-card:hover .dt-model-card__thumb img{transform:scale(1.05)}
.dt-model-card__badge{
    position:absolute;top:8px;left:8px;
    background:var(--dt-orange);
    color:#fff;
    font-size:0.65rem;
    font-weight:800;
    padding:3px 8px;
    border-radius:3px;
    display:flex;align-items:center;gap:3px;
    text-transform:uppercase;
    letter-spacing:0.5px;
}
.dt-model-card__badge svg{width:10px;height:10px}
.dt-model-card__count{
    position:absolute;bottom:8px;left:8px;
    background:rgba(0,0,0,0.7);
    color:#fff;
    font-size:0.72rem;
    font-weight:700;
    padding:3px 8px;
    border-radius:3px;
    display:flex;align-items:center;gap:4px;
    backdrop-filter:blur(4px);
}
.dt-model-card__count svg{width:12px;height:12px;color:var(--dt-orange)}
.dt-model-card__name{
    padding:10px 12px;
    font-size:0.82rem;
    font-weight:800;
    color:var(--dt-text);
    text-transform:uppercase;
    text-align:center;
    letter-spacing:0.3px;
}
.dt-model-card__name a{color:var(--dt-text)}
.dt-model-card__name a:hover{color:var(--dt-orange)}

/* Model Single Page */
.dt-model-profile{
    background:var(--dt-bg-card);
    border-radius:var(--dt-radius);
    padding:24px;
    margin-bottom:20px;
    display:flex;
    gap:24px;
    align-items:center;
    box-shadow:var(--dt-shadow);
}
.dt-model-profile__photo{
    width:120px;height:120px;border-radius:50%;
    overflow:hidden;flex-shrink:0;
    border:3px solid var(--dt-orange);
    background:#222;
}
.dt-model-profile__photo img{width:100%;height:100%;object-fit:cover}
.dt-model-profile__info{flex:1}
.dt-model-profile__name{font-size:1.4rem;font-weight:900;color:var(--dt-text);margin-bottom:4px}
.dt-model-profile__bio{font-size:0.88rem;color:var(--dt-text-light);margin-bottom:12px;line-height:1.5}
.dt-model-profile__stats{display:flex;gap:20px}
.dt-model-profile__stat{
    background:var(--dt-bg-light);
    padding:8px 16px;
    border-radius:var(--dt-radius-sm);
    text-align:center;
}
.dt-model-profile__stat strong{display:block;font-size:1.1rem;color:var(--dt-orange)}
.dt-model-profile__stat span{font-size:0.72rem;color:var(--dt-text-muted)}

/* ==========================================================================
   Utilities
   ========================================================================== */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.dt-no-results{text-align:center;padding:40px 14px;color:var(--dt-text-muted)}
.dt-no-results__icon{margin-bottom:10px}
.dt-no-results__icon svg{width:48px;height:48px;color:var(--dt-border)}
.dt-no-results__title{font-size:0.95rem;font-weight:600;color:var(--dt-text-light);margin-bottom:4px}
.dt-no-results__text{font-size:0.82rem}

/* ==========================================================================
   Responsive
   ========================================================================== */
/* Section see-all button */
.dt-section__see-all{
    display:block;text-align:center;
    margin-top:12px;padding:10px;
    background:var(--dt-bg-light);
    border-radius:var(--dt-radius-sm);
    font-size:0.82rem;font-weight:700;
    color:var(--dt-orange);
    transition:all var(--dt-transition);
}
.dt-section__see-all:hover{background:var(--dt-orange);color:#fff}

/* Section title */
.dt-section__title{
    font-size:0.95rem;font-weight:800;
    color:var(--dt-text);margin-bottom:10px;
    padding-bottom:8px;
    border-bottom:2px solid var(--dt-orange);
}

/* Mobile categories section - hidden on desktop, shown on mobile */
.dt-mobile-cats-section{display:none}
.dt-mobile-cats-section .dt-section__title{
    font-size:0.88rem;margin-bottom:8px;
}
.dt-category-list--mobile{
    list-style:none;padding:0;margin:0;
}
.dt-category-list--mobile li a{
    display:flex;justify-content:space-between;align-items:center;
    padding:8px 10px;
    background:var(--dt-bg-card);
    border-radius:var(--dt-radius-sm);
    margin-bottom:4px;
    font-size:0.8rem;font-weight:600;
    color:var(--dt-text);
    transition:all var(--dt-transition);
}
.dt-category-list--mobile li a:hover{color:var(--dt-orange);padding-left:14px}
.dt-category-list--mobile .count{
    font-size:0.68rem;color:var(--dt-text-muted);
    background:var(--dt-bg-light);padding:2px 6px;border-radius:3px;
}

@media(max-width:960px){
    .dt-layout{flex-direction:column}
    .dt-layout--sidebar .dt-sidebar{width:100%;position:static}
    .dt-category-list{grid-template-columns:repeat(3,1fr)}
    .dt-model-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:768px){
    .dt-header__search{display:none}
    .dt-header__nav{display:none}
    .dt-mobile-toggle{display:flex}
    .dt-mobile-search-btn{display:flex}
    .dt-mobile-menu{display:block}
    .dt-mobile-overlay{display:block}
    .dt-header__logo{flex:1;order:1}
    .dt-header__logo-img{max-height:28px}
    .dt-grid{gap:12px}
    .dt-grid--blog{grid-template-columns:1fr}
    .dt-stories__ring{width:60px;height:60px}
    .dt-stories__track{gap:6px}
    .dt-stories__name{font-size:0.64rem;max-width:64px}
    .dt-stories__item{width:62px}
    .dt-model-grid{grid-template-columns:repeat(2,1fr);gap:10px}
    .dt-mobile-cats-section{display:block}
    .dt-sidebar-cats{display:none}
    .dt-section{margin-bottom:16px}
    .dt-layout{gap:16px;margin-top:12px}
}
@media(max-width:480px){
    .dt-container{padding:0 8px}
    .dt-grid{grid-template-columns:repeat(2,1fr);gap:10px}
    .dt-card__title{font-size:0.78rem}
    .dt-card__meta{font-size:0.62rem;gap:4px;flex-wrap:wrap}
    .dt-card__meta-model{font-size:0.6rem}
    .dt-card__body{padding:8px 6px}
    .dt-card__title{font-size:0.72rem;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;-webkit-line-clamp:unset;line-clamp:unset;-webkit-box-orient:unset}
    .dt-blog-card__body{padding:8px}
    .dt-blog-card__title{font-size:0.78rem}
    .dt-blog-card__excerpt{display:none}
    .dt-video-info{flex-direction:column;align-items:flex-start;gap:0;padding:10px 12px}
    .dt-video-info__left{flex-wrap:wrap;gap:6px}
    .dt-video-info__divider{width:100%;height:1px;margin:8px 0}
    .dt-video-info__desc{font-size:0.78rem}
    .dt-stories__ring{width:56px;height:56px}
    .dt-stories__track{gap:4px}
    .dt-stories__name{font-size:0.6rem;max-width:58px}
    .dt-stories__item{width:58px}
    .dt-stories{margin-left:-8px;margin-right:-8px;padding-left:8px;padding-right:8px}
    .dt-stories__track{padding:4px 8px;margin:0 -8px}
    .dt-model-grid{grid-template-columns:repeat(2,1fr);gap:8px}
    .dt-model-card__name{font-size:0.72rem;padding:8px}
}

.admin-bar .dt-header{top:32px}
.admin-bar .dt-sidebar{top:48px}
@media(max-width:782px){.admin-bar .dt-header{top:46px}.admin-bar .dt-sidebar{top:62px}}

.dt-banner-widget{margin-bottom:16px;text-align:center}
.dt-banner-widget a{display:block}
.dt-banner{width:100%;max-height:80px;height:auto;border-radius:4px;object-fit:contain}
.dt-banner-widget .dt-banner.dt-banner--desktop{max-height:none;width:300px;object-fit:cover;margin:0 auto}
.dt-banner.dt-banner--desktop{display:block}
.dt-banner.dt-banner--mobile{display:none !important}
@media(max-width:768px){.dt-banner.dt-banner--desktop{display:none !important}.dt-banner.dt-banner--mobile{display:block !important;max-height:50px}.dt-banner-widget .dt-banner.dt-banner--mobile{max-height:none;aspect-ratio:1/1;object-fit:cover;width:100%}}

/* Inline Banners (Stories, Content, Above Player, Related) */
.dt-inline-banner{margin:12px 0}
.dt-inline-banner a{display:block}
.dt-inline-banner .dt-banner{width:100%;height:auto;border-radius:4px}
.dt-inline-banner--stories{margin:8px 0 12px 0}
.dt-inline-banner--content{margin:0 0 16px 0}
.dt-inline-banner--above-player{margin:0 0 10px 0}
.dt-inline-banner--related{margin:16px 0}

/* Header Banner */
.dt-header-banner{padding:8px 0}
.dt-header-banner a{display:block}
.dt-header-banner .dt-banner{width:100%;height:auto;border-radius:4px}

/* Footer Banner */
.dt-footer-banner{padding:10px 0;margin-top:16px}
.dt-footer-banner a{display:block}
.dt-footer-banner .dt-banner{width:100%;height:auto;border-radius:4px}

/* Below Player Banner */
.dt-below-player-ad{
    margin:12px 0;
    text-align:center;
}
.dt-below-player-ad a{display:block}
.dt-below-player-ad .dt-banner{width:100%;max-width:100%;height:auto;object-fit:cover;border-radius:var(--dt-radius)}
.dt-below-player-ad .dt-banner.dt-banner--desktop{width:100%;max-width:100%;max-height:none}

/* Below Partners Banners (2 stacked, full width) */
/* Stories 2x2 Grid Banners */
.dt-stories-grid-banners{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:12px 0 16px 0;
    padding:0;
}
.dt-stories-grid-banners__item{
    display:block;
    border-radius:6px;
    overflow:hidden;
    height:80px;
    transition:transform var(--dt-transition),box-shadow var(--dt-transition);
}
.dt-stories-grid-banners__item:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 16px rgba(0,0,0,0.3);
}
.dt-stories-grid-banners__item img{
    width:100%;height:100%;display:block;object-fit:cover;border-radius:6px;
}

/* Bottom 2x2 Grid Banners */
.dt-bottom-grid-banners{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin:24px 0 0 0;
    padding:0;
}
.dt-bottom-grid-banners__item{
    display:block;
    border-radius:6px;
    overflow:hidden;
    height:80px;
    transition:transform var(--dt-transition),box-shadow var(--dt-transition);
}
.dt-bottom-grid-banners__item:hover{
    transform:translateY(-2px);
    box-shadow:0 4px 16px rgba(0,0,0,0.3);
}
.dt-bottom-grid-banners__item img{
    width:100%;height:100%;display:block;object-fit:cover;border-radius:6px;
}
@media(max-width:600px){
    .dt-bottom-grid-banners{grid-template-columns:1fr;gap:8px;margin-top:16px}
    .dt-bottom-grid-banners__item{height:64px}
    .dt-stories-grid-banners{grid-template-columns:1fr;gap:8px}
    .dt-stories-grid-banners__item{height:64px}
}
