@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
body{
font-family:'Inter',sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none !important;
}

body,
input,
textarea,
button,
select {
    font-family: 'Inter', Arial, sans-serif;
}

:root {
    --bg: #000;
    --panel: #090909;
    --panel-2: #111;
    --line: #1f1f1f;
    --muted: #8b8b8b;
    --accent: #ff2d55;
    --accent-soft: rgba(255, 45, 85, 0.12);
}

html, body {
    background: var(--bg);
    color: white;
    height: 100%;
}

body {
    display: flex;
    overflow: hidden;
}

body.drawer-open {
    overflow: hidden;
}

.left-sidebar,
.right-sidebar {
    background: var(--bg);
    z-index: 50;
}

.left-sidebar {
    width: 280px;
    border-right: 1px solid var(--line);
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
}

.right-sidebar {
    width: 300px;
    border-left: 1px solid var(--line);
    padding: 20px 16px;
    display: flex;
    flex-direction: column;
}

.logo {
    font-size: 25px;
    font-weight: 800;
    color: var(--accent);
    letter-spacing: -1px;
}

.search-box {
    margin: 18px 0;
}

.search-container {
    display: flex;
    align-items: center;
    gap: 10px;
    background: var(--panel-2);
    border: 1px solid #232323;
    border-radius: 14px;
    padding: 0 14px;
}

.search-container:focus-within {
    border-color: var(--accent);
    box-shadow: 0 0 0 2px rgba(255,45,85,.12);
}

.search-container i {
    color: #666;
}

.search-container input {
    width: 100%;
    background: transparent;
    border: none;
    outline: none;
    color: white;
    padding: 14px 0;
    font-size: 14px;
}

.side-nav,
.city-list {
    overflow-y: auto;
}

.side-nav {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}

.side-cat,
.city-item,
.trend-link {
    color: var(--muted);
}

.side-cat {
    padding: 12px 14px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    gap: 12px;
    transition: .2s ease;
    font-size: 14px;
}

.side-cat:hover,
.city-item:hover,
.trend-link:hover {
    color: white;
    background: rgba(255,255,255,.05);
}

.side-cat.active {
    color: var(--accent) !important;
    font-weight: 800;
    background: var(--accent-soft);
}

.side-cat i { width: 18px; text-align: center; }
.side-cat-accent { color: #5eff9c; }
.side-cat-warning { color: #ffd54c; }
.side-cat-muted { color: #777; }
.mobile-auth-box { margin-top: auto; padding-top: 16px; border-top: 1px solid var(--line); }

.reels-container {
    flex: 1;
    overflow-y: auto;
    scroll-snap-type: y mandatory;
    -webkit-overflow-scrolling: touch;
    background: #000;
}

.reels-container::-webkit-scrollbar,
.side-nav::-webkit-scrollbar,
.city-list::-webkit-scrollbar {
    display: none;
}

.video-card {
    position: relative;
    width: 100%;
    max-width: 520px;
    height: 100vh;
    margin: 0 auto;
    scroll-snap-align: start;
    background: #050505;
    overflow: hidden;
}

.video-player {
    width: 100%;
    height: 100%;
    object-fit: cover;
    background: #050505;
    opacity: .98;
}

.video-player.is-ready { opacity: 1; }

.video-tap-zone {
    position: absolute;
    inset: 0;
    border: none;
    background: transparent;
    z-index: 2;
}

.side-bar {
    position: absolute;
    right: 14px;
    bottom: 120px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    z-index: 4;
}

.icon-group {
    text-align: center;
    cursor: pointer;
}

.icon-group i {
    font-size: 26px;
    filter: drop-shadow(0 3px 10px rgba(0,0,0,.8));
}

.icon-group span {
    display: block;
    margin-top: 5px;
    font-size: 11px;
    font-weight: 700;
    text-shadow: 0 1px 6px rgba(0,0,0,.9);
}

.icon-group-static { cursor: default; }

.ad-badge {
    position: absolute;
    top: 24px;
    right: 18px;
    z-index: 5;
    background: rgba(255,222,0,.92);
    color: #000;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 900;
}

.card-info {
    position: absolute;
    left: 14px;
    right: 80px;
    bottom: 28px;
    z-index: 4;
    padding: 18px;
    border-radius: 22px;
    background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,.58));
    backdrop-filter: blur(14px);
    border: 1px solid rgba(255,255,255,.08);
}

.place-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    margin-bottom: 8px;
}

.place-header h2 {
    font-size: 20px;
    font-weight: 800;
}

.rating-tag {
    background: #ffde00;
    color: #000;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 900;
}

.desc-text {
    font-size: 13px;
    color: #dedede;
    line-height: 1.45;
    margin-bottom: 12px;
}

.btn-maps {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: white;
    color: black;
    border-radius: 999px;
    padding: 9px 14px;
    font-size: 12px;
    font-weight: 800;
}

.city-item,
.trend-link {
    display: block;
    padding: 10px 12px;
    border-radius: 10px;
    font-size: 13px;
}

.trends-section {
    margin-top: 18px;
    padding-top: 16px;
    border-top: 1px solid var(--line);
}

.trends-section h3 {
    color: #5f5f5f;
    font-size: 12px;
    margin-bottom: 8px;
    text-transform: uppercase;
}

.comment-panel{
    position: fixed;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 420px;
    max-width: 95%;
    height: 60%;
    z-index: 9999;

    background: rgba(15,15,15,0.95);
    backdrop-filter: blur(20px);

    border-top: 1px solid rgba(255,255,255,0.08);
    border-radius: 22px 22px 0 0;

    padding: 18px;

    display: flex;
    flex-direction: column;

    box-shadow: 0 -10px 40px rgba(0,0,0,.6);
}

.comment-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 12px;
    border-bottom: 1px solid #222;
}

.comment-header i { cursor: pointer; }
.comment-list { flex: 1; overflow-y: auto; padding: 12px 0; }
.comment-item { margin-bottom: 14px; }
.comment-item strong { color: var(--accent); font-size: 12px; }
.comment-item p { color: #ccc; font-size: 13px; margin-top: 4px; }
.comment-empty { text-align: center; color: #676767; margin-top: 20px; }

.comment-input-area {
    display: flex;
    gap: 10px;
    border-top: 1px solid #222;
    padding-top: 12px;
}

.comment-input-area input {
    flex: 1;
    background: #1a1a1a;
    border: 1px solid #2a2a2a;
    color: white;
    border-radius: 12px;
    padding: 12px 14px;
    outline: none;
}

.comment-input-area button {
    width: 46px;
    border: none;
    border-radius: 12px;
    background: var(--accent);
    color: white;
    cursor: pointer;
}

.empty-state {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    color: #555;
    gap: 14px;
}

.empty-state i { font-size: 42px; }

.mobile-topbar,
.mobile-bottom-nav,
.mobile-overlay,
.drawer-header,
.drawer-close {
    display: none;
}

@media (max-width: 900px) {
    body {
        display: block;
        overflow: hidden;
        padding-top: env(safe-area-inset-top);
        background: #000;
    }

    .mobile-topbar {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        height: calc(56px + env(safe-area-inset-top));
        padding: env(safe-area-inset-top) 14px 0;
        display: flex;
        align-items: center;
        justify-content: space-between;
        background: linear-gradient(180deg, rgba(0,0,0,.82), rgba(0,0,0,.28));
        z-index: 120;
    }

    .mobile-brand {
        font-weight: 900;
        color: white;
        letter-spacing: -.5px;
    }

    .mobile-icon-btn {
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 12px;
        background: rgba(255,255,255,.1);
        color: white;
        backdrop-filter: blur(10px);
    }

    .mobile-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0,0,0,.5);
        z-index: 109;
    }

    .mobile-overlay.is-active { display: block; }

    .left-sidebar,
    .right-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        width: min(88vw, 340px);
        padding: calc(16px + env(safe-area-inset-top)) 16px calc(90px + env(safe-area-inset-bottom));
        z-index: 110;
        transform: translateX(-105%);
        transition: transform .25s ease;
        overflow-y: auto;
        background: rgba(5,5,5,.98);
        backdrop-filter: blur(18px);
        border-right: 1px solid rgba(255,255,255,.08);
    }

    .right-sidebar {
        right: 0;
        left: auto;
        transform: translateX(105%);
        border-right: none;
        border-left: 1px solid rgba(255,255,255,.08);
    }

    .mobile-panel.is-open {
        transform: translateX(0);
    }

    .drawer-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 8px;
    }

    .drawer-close {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 12px;
        background: rgba(255,255,255,.08);
        color: white;
    }

    .reels-container {
        height: 100dvh;
        padding-top: calc(56px + env(safe-area-inset-top));
        padding-bottom: calc(68px + env(safe-area-inset-bottom));
        scroll-snap-type: y mandatory;
    }

    .video-card {
        width: 100vw;
        max-width: none;
        height: calc(100dvh - 56px - env(safe-area-inset-top) - 68px - env(safe-area-inset-bottom));
        min-height: 560px;
    }

    .side-bar {
        right: 12px;
        bottom: 128px;
        gap: 16px;
    }

    .icon-group i {
        font-size: 24px;
    }

    .card-info {
        left: 12px;
        right: 68px;
        bottom: 18px;
        padding: 16px;
        border-radius: 18px;
        background: linear-gradient(180deg, rgba(0,0,0,.12), rgba(0,0,0,.72));
    }

    .place-header h2 {
        font-size: 17px;
    }

    .desc-text {
        font-size: 12px;
        margin-bottom: 10px;
    }

    .btn-maps {
        font-size: 11px;
        padding: 8px 12px;
    }

    .comment-panel {
        height: 58%;
        border-radius: 22px 22px 0 0;
        padding-bottom: calc(16px + env(safe-area-inset-bottom));
    }

    .mobile-bottom-nav {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        height: calc(68px + env(safe-area-inset-bottom));
        padding: 8px 10px env(safe-area-inset-bottom);
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        background: rgba(4,4,4,.96);
        border-top: 1px solid rgba(255,255,255,.08);
        backdrop-filter: blur(18px);
        z-index: 120;
    }

    .mobile-bottom-item {
        border: none;
        background: transparent;
        color: #ddd;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        font-size: 11px;
    }

    .mobile-bottom-item i {
        font-size: 18px;
    }

    .empty-state {
        height: calc(100dvh - 124px);
    }
}

.page-shell{background:#050505;min-height:100vh;color:#fff;display:block;overflow-y:auto}
.inner-page{max-width:1100px;margin:0 auto;padding:24px}
.page-topbar{display:flex;align-items:center;gap:16px;margin-bottom:22px}
.page-topbar h1{font-size:28px;margin:0 0 4px;font-weight:800}.page-topbar p{margin:0;color:#8a8a8a}
.page-back{width:44px;height:44px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:#101010;border:1px solid #1f1f1f;color:#fff}
.glass-card{background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.08);border-radius:24px;padding:22px;box-shadow:0 20px 50px rgba(0,0,0,.25)}
.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.stack-form{display:flex;flex-direction:column;gap:12px}.stack-form input,.stack-form textarea,.stack-form select{background:#0d0d0d;border:1px solid #262626;border-radius:14px;color:#fff;padding:14px 16px;outline:none}.stack-form textarea{min-height:120px;resize:vertical}
.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 18px;border-radius:999px;background:#161616;border:1px solid #2a2a2a;color:#fff;font-weight:700;cursor:pointer}.btn-primary{background:#ff2d55;border-color:#ff2d55;color:#fff}.btn-warning{background:#ffde00;border-color:#ffde00;color:#000}
.profile-page .profile-hero{display:grid;grid-template-columns:140px 1fr;gap:24px;align-items:center}.profile-avatar-large{width:140px;height:140px;border-radius:50%;background:linear-gradient(135deg,#ff2d55,#ff7a59);display:flex;align-items:center;justify-content:center;font-size:52px;font-weight:900}.profile-meta h2{font-size:30px;margin:0 0 10px}.profile-stats{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:12px;color:#d0d0d0}.profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.profile-grid{grid-template-columns:repeat(4,1fr);gap:12px}.empty-block{padding:40px;text-align:center;color:#8f8f8f;background:#0f0f0f;border-radius:18px;border:1px dashed #2b2b2b;grid-column:1/-1}.modern-tabs{display:flex;gap:12px;margin:20px 0}.modern-tabs .tab-btn{background:#101010;border:1px solid #262626;border-radius:999px;padding:12px 18px;color:#aaa;cursor:pointer}.modern-tabs .tab-btn.active{background:#ff2d55;border-color:#ff2d55;color:#fff}
.alert-success,.alert-error{padding:14px 16px;border-radius:16px;margin-bottom:16px}.alert-success{background:#12261c;color:#83f0b2;border:1px solid #214a34}.alert-error{background:#2a1218;color:#ff9aad;border:1px solid #5a2230}
.notification-card,.admin-video-item{display:flex;align-items:center;justify-content:space-between;gap:16px}.stack-cards{display:flex;flex-direction:column;gap:14px}.dashboard-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:18px}.stat-box strong{font-size:34px;display:block;margin-bottom:8px}.stat-box span{color:#9b9b9b}.admin-video-list{display:flex;flex-direction:column;gap:12px}.admin-video-item video{width:72px;height:110px;object-fit:cover;border-radius:14px;background:#0a0a0a}.admin-video-item p,.payment-note p{color:#8d8d8d;margin:4px 0 0}.payment-note{margin-top:16px;padding:16px;border-radius:16px;background:#0d0d0d;border:1px solid #242424}.mini-list{margin:10px 0 0 18px;color:#c6c6c6}.guest-note{font-size:12px;color:#8f8f8f;padding:12px 8px 0 8px;line-height:1.5}
@media (max-width: 900px){.settings-grid,.dashboard-stats,.profile-page .profile-hero{grid-template-columns:1fr}.profile-avatar-large{width:92px;height:92px;font-size:34px}.profile-grid{grid-template-columns:repeat(2,1fr)}.inner-page{padding:16px}}
/* ============================= */
/* YORUM MODAL */
/* ============================= */



/* Font Awesome ikonlarını ezme */
.fa,
.fa-solid,
.fa-regular,
.fa-brands,
.fas,
.far,
.fab,
i.fa,
i.fa-solid,
i.fa-regular,
i.fa-brands {
    font-family: "Font Awesome 6 Free", "Font Awesome 6 Brands" !important;
}
/* Video kartı içindeki linkleri mavi yapma */
.card-info a,
.post-meta-line a,
.place-header a {
    color: #fff !important;
    text-decoration: none !important;
    font-weight: 700;
}

/* Hover'da hafif premium görünüm */
.card-info a:hover,
.post-meta-line a:hover,
.place-header a:hover {
    color: #ffdde5 !important;
}

/* Başlığı daha modern ve büyük yap */
.place-header h2 {
    font-size: 24px !important;
    font-weight: 800 !important;
    letter-spacing: -0.03em;
    line-height: 1.1;
}

/* Açıklamayı biraz daha premium yap */
.desc-text {
    font-size: 14px !important;
    line-height: 1.6 !important;
    color: rgba(255,255,255,0.88) !important;
    font-weight: 500;
}

/* Meta satırı */
.post-meta-line {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 8px;
}

.post-meta-line span,
.post-meta-line a {
    font-size: 13px;
    font-weight: 600;
    color: rgba(255,255,255,0.82) !important;
}

/* Kartı biraz daha modern göster */
.card-info {
    padding: 20px !important;
    border-radius: 24px !important;
    background: linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.62)) !important;
    backdrop-filter: blur(18px);
    border: 1px solid rgba(255,255,255,.10) !important;
}
.place-header h2 {
    font-size: 26px !important;
    font-weight: 800 !important;
    letter-spacing: -0.04em;
}
/* ============================= */
/* MODERN VIDEO CARD UI */
/* ============================= */

/* Kart cam efekti */
.card-info{
    padding:20px !important;
    border-radius:24px !important;

    background: linear-gradient(
        180deg,
        rgba(0,0,0,.12),
        rgba(0,0,0,.70)
    ) !important;

    backdrop-filter: blur(18px);

    border:1px solid rgba(255,255,255,.10) !important;

    box-shadow:
        0 10px 30px rgba(0,0,0,.55);
}

/* Başlık */
.place-header h2{
    font-size:26px !important;
    font-weight:800 !important;
    letter-spacing:-0.03em;
    line-height:1.15;
}

/* Meta satırı */
.post-meta-line{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
    margin-top:8px;
}

/* Meta elemanları */
.post-meta-line span,
.post-meta-line a{
    font-size:13px;
    font-weight:600;
    color:rgba(255,255,255,.82) !important;

    background:rgba(255,255,255,.06);
    padding:5px 10px;
    border-radius:999px;
}

/* Hover efekti */
.post-meta-line a:hover{
    background:rgba(255,255,255,.12);
}

/* Açıklama */
.desc-text{
    font-size:14px !important;
    line-height:1.6 !important;
    color:rgba(255,255,255,.88) !important;
    font-weight:500;

    margin-top:8px;
}

/* Harita butonu */
.btn-maps{
    margin-top:10px;

    display:inline-flex;
    align-items:center;
    gap:6px;

    background:white;
    color:black;

    border-radius:999px;
    padding:9px 16px;

    font-size:12px;
    font-weight:800;

    transition:.2s;
}

/* hover */
.btn-maps:hover{
    transform:scale(1.04);
}

/* rating daha modern */
.rating-tag{
    background:#ffcc00;
    color:black;

    padding:4px 10px;

    border-radius:999px;

    font-size:12px;
    font-weight:900;

    box-shadow:
        0 2px 10px rgba(255,204,0,.35);
}

/* v1001 additions - theme preserved */
body.inner-page-body{display:block;overflow:auto;background:#000;color:#fff}
.inner-page{max-width:1200px;margin:0 auto;padding:28px 16px 80px;}
.page-topbar{display:flex;align-items:center;gap:14px;margin-bottom:20px}
.page-back{width:44px;height:44px;border-radius:14px;background:#101114;border:1px solid #23252b;color:#fff;display:flex;align-items:center;justify-content:center}
.page-topbar h1{font-size:34px;font-weight:800;letter-spacing:-.03em}
.page-topbar p{margin-top:4px;color:#9ca3af;font-size:14px}
.glass-card{background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:24px;box-shadow:0 20px 50px rgba(0,0,0,.28)}
.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border-radius:999px;background:#161a22;border:1px solid #282d37;color:#fff;font-weight:700;font-size:14px}
.btn-pill.btn-primary{background:#ff2d55;border-color:#ff2d55}
.btn-pill.btn-warning{background:rgba(255,213,76,.1);border-color:rgba(255,213,76,.28);color:#ffd54c}
.profile-hero{display:grid;grid-template-columns:120px 1fr;gap:20px;padding:24px;margin-bottom:18px}
.profile-avatar-large{width:120px;height:120px;border-radius:28px;background:linear-gradient(135deg,#ff2d55,#8b1e35);display:flex;align-items:center;justify-content:center;font-size:42px;font-weight:800;color:#fff}
.profile-meta h2{font-size:32px;margin-bottom:8px}
.profile-stats{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:10px;color:#d1d5db}
.profile-stats strong{font-size:20px;color:#fff}
.profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}
.modern-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}
.modern-tabs .tab-btn{border:none;background:#11161e;color:#b8c0cc;padding:11px 16px;border-radius:999px;font-weight:700;cursor:pointer}
.modern-tabs .tab-btn.active{background:#ff2d55;color:#fff}
.profile-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.video-item{display:block;position:relative;overflow:hidden;background:#0c0f15;border:1px solid #1f2430;border-radius:18px;min-height:240px}
.video-item img,.video-item video{width:100%;height:240px;object-fit:cover;display:block;background:#000}
.video-label{position:absolute;left:0;right:0;bottom:0;padding:12px 14px;background:linear-gradient(180deg,transparent,rgba(0,0,0,.92));font-weight:700;color:#fff}
.empty-block{padding:40px 20px;border:1px dashed #2a2f3a;border-radius:18px;color:#98a1af;background:#0b0e14;text-align:center;grid-column:1/-1}
.utility-links{position:fixed;top:20px;right:320px;z-index:60;display:flex;gap:10px;flex-wrap:wrap}
.utility-link{padding:10px 14px;border-radius:999px;background:rgba(15,17,22,.92);border:1px solid rgba(255,255,255,.08);color:#d1d5db;font-size:13px;font-weight:700;backdrop-filter:blur(8px)}
.utility-link:hover{color:#fff;border-color:rgba(255,45,85,.4)}
.comment-panel{position:absolute;right:72px;bottom:70px;width:320px;max-height:65vh;background:rgba(10,12,18,.98);border:1px solid rgba(255,255,255,.08);border-radius:18px;overflow:hidden;z-index:9;box-shadow:0 16px 40px rgba(0,0,0,.45)}
.comment-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;border-bottom:1px solid #1c2230;font-size:14px}
.comment-header i{cursor:pointer;color:#9ca3af}
.comment-list{max-height:42vh;overflow:auto;padding:10px}
.comment-item{padding:10px 12px;border-radius:14px;background:#0f141d;border:1px solid #1f2835;margin-bottom:8px}
.comment-item.is-reply{margin-left:16px;background:#101924}
.comment-item strong{display:block;font-size:13px;margin-bottom:5px;color:#fff}
.comment-item p{font-size:13px;line-height:1.55;color:#d5dbe5}
.comment-meta{display:flex;gap:8px;margin-top:7px}
.comment-action{border:none;background:#151d28;color:#c3cad4;padding:6px 10px;border-radius:999px;font-size:12px;cursor:pointer}
.comment-action:hover{background:#1d2633;color:#fff}
.comment-input-area{display:flex;gap:8px;padding:10px;border-top:1px solid #1c2230;background:#0b1017}
.comment-input-area input{flex:1;border:none;outline:none;background:#131a24;color:#fff;padding:11px 12px;border-radius:12px;font-size:13px}
.comment-input-area button{width:42px;border:none;border-radius:12px;background:#ff2d55;color:#fff;cursor:pointer}
.comment-empty{padding:16px 8px;color:#8993a1;font-size:13px;text-align:center}
.comment-reply-info{padding:8px 10px;background:#131923;color:#d9dee6;font-size:12px;border-top:1px solid #1c2230}
.comment-reply-info button{border:none;background:none;color:#ff6582;font-weight:700;cursor:pointer}
.admin-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:18px}
.stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:18px}
.stat-box{padding:18px;border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08)}
.stat-box .k{font-size:13px;color:#9ca3af;margin-bottom:8px}.stat-box .v{font-size:30px;font-weight:800}
.panel-card{padding:20px}.panel-card h2{font-size:24px;margin-bottom:6px}.panel-card p.sub{color:#98a1af;font-size:14px;margin-bottom:16px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-group{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.form-group.full{grid-column:1/-1}.input-dark,.textarea-dark,.select-dark{width:100%;padding:13px 14px;border-radius:16px;background:#0e1219;border:1px solid #262d3a;color:#fff;outline:none}.textarea-dark{min-height:120px;resize:vertical}
.table-wrap{overflow:auto;border-radius:18px;border:1px solid rgba(255,255,255,.07)}
.admin-table{width:100%;border-collapse:collapse;background:#0d1118}.admin-table th,.admin-table td{padding:12px 12px;border-bottom:1px solid #1a2230;text-align:left;font-size:13px}.admin-table th{color:#fff;background:#111826}.admin-table td{color:#cfd6df}.table-actions{display:flex;gap:8px;flex-wrap:wrap}
.blog-hero{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:20px}.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.blog-card{display:block;padding:18px;background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,.015));border:1px solid rgba(255,255,255,.08);border-radius:22px;color:#fff;min-height:240px}.blog-card:hover{border-color:rgba(255,45,85,.35);transform:translateY(-2px)}
.blog-card .chip{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(255,45,85,.12);color:#ff7390;font-size:12px;font-weight:700;margin-bottom:14px}.blog-card h3{font-size:21px;line-height:1.25;margin-bottom:10px}.blog-card p{font-size:14px;color:#a8b0bc;line-height:1.65}.article-wrap{max-width:860px;margin:0 auto}.article-wrap .glass-card{padding:26px}.article-meta{display:flex;gap:12px;flex-wrap:wrap;color:#8f98a8;font-size:13px;margin:10px 0 20px}.article-body{font-size:16px;line-height:1.9;color:#e6ebf2}.article-body h2{font-size:28px;margin:28px 0 12px}.article-body h3{font-size:22px;margin:24px 0 10px}.article-body p{margin-bottom:15px}.legal-page .glass-card,.support-page .glass-card{padding:24px;max-width:860px;margin:0 auto}.footer-links-inline{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;padding:16px 20px 90px}.footer-links-inline a{color:#a8b0bc;font-size:13px}.footer-links-inline a:hover{color:#fff}
@media (max-width: 900px){body{display:block;overflow:auto}.left-sidebar,.right-sidebar{display:none}.reels-container{height:auto;overflow:visible;padding-top:66px;padding-bottom:88px}.video-card{height:88vh;max-width:100%}.utility-links{position:fixed;top:14px;right:12px;left:12px;overflow:auto;flex-wrap:nowrap;padding-bottom:4px}.utility-link{white-space:nowrap;font-size:12px;padding:9px 12px}.profile-hero{grid-template-columns:1fr}.profile-grid,.blog-grid,.stats-row,.admin-grid,.form-grid{grid-template-columns:1fr}.comment-panel{left:10px;right:10px;width:auto;bottom:84px}.article-wrap .glass-card{padding:20px}}

/* ===== v2002 theme overhaul ===== */
:root {
    --bg: #050505;
    --panel: #0c0c0e;
    --panel-2: #101115;
    --panel-3: rgba(255,255,255,.06);
    --line: rgba(255,255,255,.08);
    --line-strong: rgba(255,255,255,.14);
    --muted: #9aa0aa;
    --text-soft: #d4d8df;
    --accent: #ff2d55;
    --accent-2: #7c5cff;
    --accent-soft: rgba(255,45,85,.15);
    --shadow-1: 0 18px 60px rgba(0,0,0,.38);
    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;
}
html,body{scroll-behavior:smooth;}
body{background:
 radial-gradient(circle at top left, rgba(255,45,85,.08), transparent 32%),
 radial-gradient(circle at top right, rgba(124,92,255,.08), transparent 24%),
 var(--bg);
}
.utility-links{position:fixed;left:50%;top:12px;transform:translateX(-50%);display:flex;gap:10px;z-index:70;background:rgba(8,8,10,.72);backdrop-filter:blur(16px);border:1px solid var(--line);border-radius:999px;padding:8px 12px;box-shadow:var(--shadow-1)}
.utility-link{color:#fff;padding:8px 12px;border-radius:999px;font-size:13px;font-weight:700;display:flex;align-items:center;gap:8px}
.utility-link:hover{background:rgba(255,255,255,.08)}
.panel-mini-copy{margin:4px 0 0;color:var(--muted);font-size:12px}
.panel-hero-card{padding:18px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));margin-bottom:16px;box-shadow:var(--shadow-1)}
.panel-hero-card h2{font-size:24px;line-height:1.05;margin:12px 0 8px;font-weight:900;letter-spacing:-.03em}
.panel-hero-card p{font-size:13px;line-height:1.6;color:var(--text-soft)}
.panel-hero-badge{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.08);border:1px solid var(--line);padding:7px 12px;border-radius:999px;font-size:12px;font-weight:800}
.left-sidebar,.right-sidebar{background:rgba(8,8,10,.88);backdrop-filter:blur(18px)}
.section-title{font-size:12px;font-weight:900;letter-spacing:.08em;color:var(--muted);margin:8px 0 10px;text-transform:uppercase}
.city-item,.trend-link{display:block;padding:11px 14px;border-radius:14px;font-weight:600}
.city-item{margin-bottom:4px}
.trends-section{margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.trends-section h3{font-size:15px;margin-bottom:10px}
.trend-link{display:flex;justify-content:space-between;gap:12px;align-items:center}
.trend-link small{color:var(--muted);font-size:11px;font-weight:700}
.reels-container{padding-top:72px;padding-bottom:12px;background:transparent}
.video-card{max-width:620px;padding:20px 16px;height:100vh;display:flex;align-items:center;justify-content:center;background:transparent}
.video-stage{position:absolute;inset:16px;border-radius:36px;overflow:hidden;background:#000;box-shadow:var(--shadow-1);border:1px solid rgba(255,255,255,.08)}
.video-player{width:100%;height:100%;object-fit:cover;background:#020202;user-select:none;-webkit-user-select:none}
.video-gradient{position:absolute;inset:0;background:linear-gradient(180deg, rgba(0,0,0,.1) 0%, rgba(0,0,0,.05) 35%, rgba(0,0,0,.68) 82%, rgba(0,0,0,.92) 100%);pointer-events:none;z-index:1}
.video-tap-zone{z-index:2}
.ad-badge{top:34px;right:34px;padding:8px 12px;font-size:11px;background:rgba(255,208,0,.95);font-weight:900;letter-spacing:.03em}
.side-bar{right:30px;bottom:150px;gap:16px;z-index:5}
.icon-group,.icon-link-group{display:flex;flex-direction:column;align-items:center;justify-content:center;width:62px;min-height:62px;padding:10px 8px;border-radius:20px;background:rgba(10,10,12,.36);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08);box-shadow:0 10px 26px rgba(0,0,0,.28)}
.icon-group i{font-size:23px}
.icon-group span{font-size:11px;font-weight:800;margin-top:6px}
.icon-link-group{color:#fff}
.profile-chip-link{padding:8px 6px;width:70px}
.profile-floating-link{color:#fff;display:flex;flex-direction:column;align-items:center;gap:6px}
.floating-avatar{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg, var(--accent), var(--accent-2));font-weight:900;border:2px solid rgba(255,255,255,.8)}
.card-info{left:30px;right:108px;bottom:30px;padding:20px 20px 18px;border-radius:26px;background:linear-gradient(180deg, rgba(12,12,16,.28), rgba(12,12,16,.72));border:1px solid rgba(255,255,255,.1);box-shadow:0 20px 40px rgba(0,0,0,.24);z-index:4}
.chip-row{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.micro-chip{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);font-size:12px;font-weight:800;color:#fff}
.accent-chip{background:rgba(255,45,85,.16);color:#ff92aa}
.post-title{font-size:28px;line-height:1.05;font-weight:900;letter-spacing:-.03em;margin:0 0 8px}
.post-meta-line{display:flex;gap:14px;flex-wrap:wrap;color:var(--text-soft);font-size:13px;font-weight:600}
.post-meta-line a{color:#fff}
.desc-text{font-size:14px;line-height:1.65;color:#f7f7f8;margin-top:12px;display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;-webkit-line-clamp:4}
.lead-text{font-weight:800;color:#fff;-webkit-line-clamp:2}
.post-link-grid{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.tag-link{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08);color:#fff;font-size:13px;font-weight:800}
.tag-link:hover{background:rgba(255,255,255,.14)}
.rating-box{margin-top:14px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding-top:12px;border-top:1px solid rgba(255,255,255,.08)}
.rating-stars{display:flex;gap:4px}
.rate-star{background:none;border:none;color:#f5c451;font-size:22px;cursor:pointer;padding:0 1px;line-height:1;transition:transform .15s ease,color .15s ease}
.rate-star:hover{transform:translateY(-2px) scale(1.07);color:#ffd66b}
.empty-state{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:32px 20px;max-width:760px;margin:0 auto}
.empty-state-icon{width:88px;height:88px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);font-size:32px;margin-bottom:18px}
.empty-state h2{font-size:34px;line-height:1.08;margin-bottom:12px}
.empty-state p{max-width:560px;color:var(--muted);line-height:1.7}
.empty-state-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;margin-top:20px}
.footer-links-inline{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;padding:18px 0 92px;color:var(--muted)}
.footer-links-inline a{color:var(--muted);font-size:13px;font-weight:700}
.btn-pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 16px;border-radius:999px;border:1px solid var(--line-strong);color:#fff;background:rgba(255,255,255,.04);font-weight:800}
.btn-primary{background:linear-gradient(135deg, var(--accent), #ff577a);border-color:transparent}
.btn-warning{background:linear-gradient(135deg, #ffc53d, #ffac33);color:#000;border-color:transparent}
.mobile-topbar{background:rgba(8,8,10,.85);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}
.mobile-brand{font-weight:900;letter-spacing:-.04em}
.mobile-bottom-nav{background:rgba(8,8,10,.88);backdrop-filter:blur(18px);border-top:1px solid var(--line)}
.mobile-bottom-item{color:#fff}
.mobile-bottom-item span{font-size:11px;font-weight:800}
.comment-panel{position:absolute;right:20px;top:20px;bottom:20px;width:min(400px, calc(100% - 40px));border-radius:28px;background:rgba(8,8,10,.9);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.08);z-index:7;display:flex;flex-direction:column;box-shadow:var(--shadow-1)}
.comment-header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px;border-bottom:1px solid var(--line)}
.comment-list{flex:1;overflow:auto;padding:16px 18px 4px}
.comment-item{padding:14px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);margin-bottom:10px}
.comment-item.is-reply{margin-left:22px;background:rgba(255,255,255,.06)}
.comment-item p{margin:8px 0;color:#fff;line-height:1.6}
.comment-meta{display:flex;gap:12px;align-items:center;font-size:12px;color:var(--muted)}
.comment-action{background:none;border:none;color:#fff;cursor:pointer;font-weight:700}
.comment-input-area{display:flex;gap:10px;padding:14px 18px 18px;border-top:1px solid var(--line)}
.comment-input-area input{flex:1;border-radius:14px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#fff;padding:14px}
.comment-input-area button{width:48px;border:none;border-radius:14px;background:linear-gradient(135deg, var(--accent), #ff577a);color:#fff}
.comment-reply-info{padding:0 18px 10px;color:#ffb3c1;font-size:12px;font-weight:700}
.inner-page-body{display:block;overflow:auto;background:
 radial-gradient(circle at top left, rgba(255,45,85,.08), transparent 32%),
 radial-gradient(circle at top right, rgba(124,92,255,.08), transparent 24%),
 var(--bg);min-height:100vh}
.inner-page{max-width:1200px;margin:0 auto;padding:96px 18px 40px}
.narrow-page{max-width:900px}
.page-topbar{display:flex;align-items:flex-start;gap:14px;margin-bottom:18px}
.page-back{width:48px;height:48px;border-radius:16px;border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(255,255,255,.04)}
.page-topbar h1{font-size:38px;line-height:1.05;letter-spacing:-.04em;margin:0 0 6px}
.page-topbar p{color:var(--muted);line-height:1.6}
.glass-card{background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);border-radius:30px;box-shadow:var(--shadow-1)}
.legal-shell,.support-shell,.article-shell{padding:28px}
.legal-hero,.support-hero,.article-hero{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;margin-bottom:20px}
.legal-icon,.support-icon,.article-icon{width:64px;height:64px;border-radius:20px;display:flex;align-items:center;justify-content:center;font-size:26px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08)}
.legal-prose,.article-body{color:#f3f4f6;line-height:1.8;font-size:15px}
.legal-prose p,.article-body p{margin-bottom:16px}
.muted-copy{color:var(--muted);line-height:1.7}
.support-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:18px}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.form-group.full{grid-column:1/-1}
.input-dark,.textarea-dark{width:100%;border-radius:16px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);padding:14px 16px;color:#fff;outline:none}
.textarea-dark{min-height:140px;resize:vertical}
.form-group label{display:block;font-size:13px;font-weight:800;margin-bottom:8px;color:#fff}
.support-side-card{padding:20px}
.support-contact-list{display:grid;gap:12px;margin-top:14px}.support-contact-item{display:flex;gap:12px;align-items:flex-start;padding:14px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06)}
.support-contact-item i{width:18px;margin-top:3px;color:#ff7b97}
.blog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.blog-card{padding:22px;border-radius:26px;background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.08);color:#fff;min-height:220px;box-shadow:var(--shadow-1)}
.blog-card h3{font-size:22px;line-height:1.18;margin:16px 0 10px}.blog-card p{color:var(--muted);line-height:1.7}
.chip{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;background:rgba(255,45,85,.12);color:#ff8ea6;font-size:12px;font-weight:900}
.blog-hero{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:24px}
.article-meta{display:flex;gap:14px;align-items:center;flex-wrap:wrap;color:var(--muted);margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
.profile-hero{padding:24px;display:flex;gap:18px;align-items:center}.profile-avatar-large{width:90px;height:90px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,var(--accent),var(--accent-2));font-size:30px;font-weight:900}.profile-meta h2{font-size:30px;margin-bottom:8px}.profile-stats{display:flex;gap:10px;flex-wrap:wrap;margin:12px 0}.profile-stats span{padding:10px 14px;border-radius:18px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);text-align:center;min-width:100px}.profile-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:14px}.modern-tabs{display:flex;gap:10px;flex-wrap:wrap;margin:18px 0}.tab-btn{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);color:#fff;padding:10px 16px;border-radius:999px;font-weight:800}.tab-btn.active{background:var(--accent-soft);color:#ff95aa}.profile-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.video-item{display:block;position:relative;border-radius:24px;overflow:hidden;border:1px solid rgba(255,255,255,.08);min-height:220px;background:#000}.video-item img,.video-item video{width:100%;height:100%;object-fit:cover}.video-label{position:absolute;left:0;right:0;bottom:0;padding:16px;background:linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.8));font-weight:800;color:#fff}
@media (max-width: 1200px){.blog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.profile-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.support-grid{grid-template-columns:1fr}}
@media (max-width: 900px){
  .utility-links{display:none}
  .reels-container{padding-top:58px;padding-bottom:80px}
  .left-sidebar,.right-sidebar{position:fixed;top:0;bottom:0;width:min(88vw,340px);transform:translateX(-105%);transition:transform .25s ease}
  .right-sidebar{right:0;left:auto;transform:translateX(105%)}
  .mobile-panel.is-open{transform:translateX(0)}
  .mobile-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);opacity:0;pointer-events:none;transition:.2s ease;z-index:45}.mobile-overlay.is-active{opacity:1;pointer-events:auto}
  .video-card{max-width:none;padding:0;height:calc(100svh - 58px - 74px)}
  .video-stage{inset:0;border-radius:0}
  .card-info{left:14px;right:14px;bottom:14px;padding:16px 16px 14px}
  .side-bar{right:14px;bottom:240px}.icon-group,.icon-link-group{width:54px;min-height:54px;border-radius:18px}
  .desc-text{-webkit-line-clamp:3}.lead-text{-webkit-line-clamp:2}
  .comment-panel{inset:auto 10px 88px 10px;width:auto}
  .post-title{font-size:22px}
  .inner-page{padding-top:84px}.blog-grid{grid-template-columns:1fr}.profile-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width: 640px){
  .side-bar{right:12px;bottom:225px}
  .chip-row{gap:6px}.micro-chip{padding:7px 10px;font-size:11px}
  .post-meta-line{gap:10px;font-size:12px}
  .tag-link{padding:9px 12px;font-size:12px}
  .rating-box{gap:8px}.rate-star{font-size:20px}
  .form-grid{grid-template-columns:1fr}
  .profile-hero{flex-direction:column;align-items:flex-start}.profile-grid{grid-template-columns:1fr 1fr}.page-topbar h1{font-size:31px}
}