/* Sohbet Sistemi Arayüzü V3.2.7 */
:root{--ssblue:#4054bf;--ssdark:#071327;--sspink:#e91e63}
body.ss327-sade{background:#eef1ff;color:#14205c}
.container{max-width:1140px}
.ss327-logo,.text-logo{color:var(--ssblue)!important;font-weight:950;font-size:30px;letter-spacing:.4px;text-decoration:none!important;text-transform:uppercase}
.ss327-navbox{border:2px solid var(--ssblue);border-radius:24px}
.ss327-menu{gap:6px}
.ss327-menu .nav-link{
    position:relative;isolation:isolate;overflow:hidden;border-radius:999px;
    padding:10px 14px!important;color:#10227f!important;font-size:13px;font-weight:950;text-transform:uppercase;
    transition:color .24s ease,transform .24s ease,box-shadow .24s ease
}
.ss327-menu .nav-link:before{
    content:"";position:absolute;inset:0;border-radius:999px;background:linear-gradient(135deg,#4054bf,#6a55dc);
    transform:scaleX(0);transform-origin:left center;transition:transform .26s ease;z-index:-1
}
.ss327-menu .nav-link:hover,.ss327-menu .nav-link.active{color:#fff!important;transform:translateY(-3px);box-shadow:0 12px 24px rgba(64,84,191,.20)}
.ss327-menu .nav-link:hover:before,.ss327-menu .nav-link.active:before{transform:scaleX(1)}
.ss327-header-small{min-height:auto!important;padding-bottom:30px}
.ss327-hero-wrap{padding-bottom:35px}
.ss327-page-wrap{position:relative;padding:50px 0 80px}
.ss327-content-card{background:#fff;border:2px solid var(--ssblue);border-radius:24px;padding:34px 38px;box-shadow:0 18px 45px rgba(64,84,191,.06)}
.ss327-content-card h1{color:var(--ssblue);font-weight:950;text-transform:uppercase;margin-bottom:18px}
.ss327-content-card p,.ss327-content-card li{line-height:1.75;color:#24305d}
.ss327-sidebar{position:relative;z-index:2}
.ss327-side-card{background:linear-gradient(180deg,#101a37,#071327);border:1px solid rgba(64,84,191,.4);border-radius:18px;padding:16px;margin-bottom:16px;box-shadow:0 18px 45px rgba(0,0,0,.14);color:#fff}
.ss327-side-title{display:flex;align-items:center;gap:8px;color:#fff;font-size:13px;font-weight:950;text-transform:uppercase;margin-bottom:12px}
.ss327-side-title span{width:30px;height:30px;border-radius:10px;background:linear-gradient(135deg,#4268ff,#e91e63);display:flex;align-items:center;justify-content:center}
.ss327-side-link,.ss327-mini-post{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:43px;border-radius:12px;background:rgba(255,255,255,.06);color:#fff!important;text-decoration:none!important;padding:8px 11px;margin-bottom:8px;font-weight:850;transition:.24s ease}
.ss327-side-link:hover,.ss327-mini-post:hover{transform:translateY(-3px);background:rgba(64,84,191,.28)}
.ss327-side-link b{min-width:24px;height:24px;border-radius:50%;background:rgba(255,255,255,.16);display:flex;align-items:center;justify-content:center}
.ss327-mini-post{justify-content:flex-start}
.ss327-mini-post i{width:26px;height:26px;border-radius:9px;background:linear-gradient(135deg,#e91e63,#7c3aed);display:flex;align-items:center;justify-content:center;font-style:normal;flex:0 0 auto}
.ss327-mini-post span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12px}
.ss327-empty{min-height:70px;display:flex;align-items:center;justify-content:center;color:#aab7d8;text-align:center;font-size:12px}
.ss327-cta{text-align:center;padding:24px}
.ss327-cta .crown{font-size:28px;margin-bottom:10px}
.ss327-cta h3{font-size:18px;font-weight:950;margin-bottom:8px}
.ss327-cta p{color:#aab7d8;font-size:13px;line-height:1.55}
.ss327-cta a{display:inline-flex;min-height:38px;padding:9px 17px;border-radius:999px;background:linear-gradient(135deg,#e91e63,#7c3aed);color:#fff!important;text-decoration:none!important;font-weight:950}
.ss327-meta-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin:10px 0}
.ss327-meta-grid span{background:#f9f9f9;border:1px solid #e4e7f2;border-radius:9px;min-height:30px;display:flex;align-items:center;justify-content:center;gap:4px;color:#565656;font-size:11px;font-weight:750;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 6px}
.ss327-post-card .smallbas a{text-decoration:none;color:inherit}
.ss327-post-card .smallimage{object-fit:cover}
.devami,.sbaglan,.playstore,.appstore,.mircindir,footer li,.sosyals{transition:.25s ease}
.devami:hover,.sbaglan:hover,.playstore:hover,.appstore:hover,.mircindir:hover,footer li:hover,.sosyals:hover{transform:translateY(-4px);box-shadow:0 12px 22px rgba(63,81,181,.18)}
.ss327-pagination{border:2px solid var(--ssblue);border-radius:20px;padding:10px 14px;min-height:58px;display:flex;align-items:center;gap:5px;margin-top:20px}
.ss327-pagination a,.ss327-pagination span{display:inline-flex;align-items:center;justify-content:center;text-decoration:none;width:31px;height:31px;border-radius:6px;font-weight:800;font-size:13px;background:#e0e0e0;color:#555}
.ss327-pagination .current{background:#888;color:#fff}
.ss327-debug-alert{border:2px dashed #e91e63;border-radius:16px;padding:18px;margin:18px 0;background:#fff4f7;color:#84224a;font-weight:800}
.ss327-form input,.ss327-form textarea{width:100%;border:1px solid #dbe3ff;border-radius:12px;min-height:42px;padding:10px 12px;margin-bottom:12px}
.ss327-form textarea{min-height:140px}
.ss327-form button{width:100%;min-height:46px;border:0;border-radius:12px;background:#4054bf;color:#fff;font-weight:950}
footer .footer-widget li a{text-decoration:none}
@media(max-width:992px){.ss327-header{min-height:auto!important}.ss327-sidebar{margin-top:25px}.container{max-width:calc(100% - 24px)}}


/* Sohbet Girişi yeni alt alta kart yapısı V3.2.9 */
.ss329-cta-panel{
    width:100%;
    max-width:540px;
    margin:0 auto;
    padding:24px;
    position:relative;
    overflow:hidden;
    background:
        radial-gradient(circle at 12% 0%,rgba(255,61,113,.18),transparent 35%),
        radial-gradient(circle at 88% 100%,rgba(255,159,67,.14),transparent 35%),
        linear-gradient(180deg,rgba(13,13,13,.96),rgba(6,10,18,.98));
    border:1px solid rgba(255,255,255,.08);
    box-shadow:0 24px 70px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06);
}
.ss329-cta-panel:before{
    content:"";
    position:absolute;
    left:10%;
    right:10%;
    top:0;
    height:1px;
    background:linear-gradient(90deg,transparent,rgba(255,61,113,.55),rgba(255,159,67,.35),transparent);
}
.ss329-panel-title{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin:0 0 14px;
    color:rgba(255,255,255,.72);
    font-family:Arial,Helvetica,sans-serif;
    text-transform:uppercase;
    letter-spacing:2.5px;
    font-size:10px;
    font-weight:950;
}
.ss329-title-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#ff3d71;
    box-shadow:0 0 16px rgba(255,61,113,.7);
}
.ss329-cta-stack{
    display:flex;
    flex-direction:column;
    gap:14px;
}
.ss329-btn{
    min-height:88px;
    width:100%;
    position:relative;
    display:flex;
    align-items:center;
    gap:18px;
    padding:18px 20px;
    border-radius:20px;
    border:1px solid transparent;
    text-decoration:none!important;
    cursor:pointer;
    overflow:hidden;
    isolation:isolate;
    transition:transform .32s cubic-bezier(.23,1,.32,1), box-shadow .32s ease, border-color .32s ease, background .32s ease;
}
.ss329-btn:before{
    content:"";
    position:absolute;
    inset:0;
    opacity:0;
    transition:opacity .35s ease;
    z-index:-1;
}
.ss329-btn:after{
    content:"";
    position:absolute;
    left:20px;
    right:20px;
    bottom:13px;
    height:3px;
    border-radius:999px;
    opacity:.78;
    transform:scaleX(.25);
    transform-origin:left;
    transition:transform .35s cubic-bezier(.23,1,.32,1);
}
.ss329-btn:hover{
    transform:translateY(-6px);
}
.ss329-btn:hover:before{
    opacity:1;
}
.ss329-btn:hover:after{
    transform:scaleX(1);
}
.ss329-btn-icon{
    width:58px;
    height:58px;
    border-radius:19px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:23px;
    flex:0 0 auto;
    transition:transform .32s ease;
}
.ss329-btn:hover .ss329-btn-icon{
    transform:scale(1.08) rotate(-3deg);
}
.ss329-btn-body{
    min-width:0;
    flex:1;
    display:flex;
    flex-direction:column;
    gap:4px;
}
.ss329-btn-title{
    font-family:Arial,Helvetica,sans-serif;
    font-size:18px;
    font-weight:950;
    letter-spacing:.4px;
    line-height:1.08;
    text-transform:uppercase;
}
.ss329-btn-sub{
    font-size:13px;
    font-weight:700;
    color:rgba(255,255,255,.46);
}
.ss329-btn-arrow{
    margin-left:auto;
    font-size:18px;
    color:rgba(255,255,255,.58);
    opacity:0;
    transform:translateX(-8px);
    transition:all .3s ease;
    flex:0 0 auto;
}
.ss329-btn:hover .ss329-btn-arrow{
    opacity:1;
    transform:translateX(0);
}
.ss329-btn-chat{
    background:rgba(255,61,113,.075);
    border-color:rgba(255,61,113,.20);
}
.ss329-btn-chat:before{
    background:radial-gradient(ellipse at 20% 50%,rgba(255,61,113,.16),transparent 70%);
}
.ss329-btn-chat:after{
    background:linear-gradient(90deg,#ff3d71,#845ec2,#19e1ff);
}
.ss329-btn-chat:hover{
    border-color:#ff3d71;
    box-shadow:0 16px 40px rgba(255,61,113,.22);
}
.ss329-btn-chat .ss329-btn-icon{
    color:#fff;
    background:linear-gradient(135deg,#ff3d71,#e91e63);
    box-shadow:0 0 26px rgba(255,61,113,.24);
}
.ss329-btn-chat .ss329-btn-title{
    color:#ff3d71;
}
.ss329-btn-system{
    background:rgba(0,201,167,.065);
    border-color:rgba(0,201,167,.18);
}
.ss329-btn-system:before{
    background:radial-gradient(ellipse at 20% 50%,rgba(0,201,167,.13),transparent 70%);
}
.ss329-btn-system:after{
    background:linear-gradient(90deg,#00c9a7,#19e1ff);
}
.ss329-btn-system .ss329-btn-icon{
    color:#020617;
    background:#00c9a7;
}
.ss329-btn-system .ss329-btn-title{
    color:#00c9a7;
}
.ss329-btn-system.is-disabled{
    opacity:.38;
    pointer-events:none;
    cursor:default;
}
.ss329-btn-register{
    background:rgba(255,159,67,.075);
    border-color:rgba(255,159,67,.22);
}
.ss329-btn-register:before{
    background:radial-gradient(ellipse at 20% 50%,rgba(255,159,67,.14),transparent 70%);
}
.ss329-btn-register:after{
    background:linear-gradient(90deg,#ff9f43,#ff7a00,#ff3d71);
}
.ss329-btn-register:hover{
    border-color:#ff9f43;
    box-shadow:0 16px 40px rgba(255,159,67,.22);
}
.ss329-btn-register .ss329-btn-icon{
    color:#020617;
    background:linear-gradient(135deg,#ff9f43,#ffb15f);
    box-shadow:0 0 26px rgba(255,159,67,.22);
}
.ss329-btn-register .ss329-btn-title{
    color:#ff9f43;
}
.ss329-users-pill{
    width:max-content;
    margin:18px auto 0;
    min-height:30px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:9px;
    padding:6px 18px;
    border-radius:999px;
    background:rgba(255,61,113,.10);
    border:1px solid rgba(255,61,113,.22);
    color:#ff7aa3;
    font-size:10px;
    line-height:1;
    font-weight:950;
    letter-spacing:3px;
    text-transform:uppercase;
}
.ss329-users-pill span{
    letter-spacing:0;
}
@media(max-width:992px){
    .ss329-cta-panel{
        max-width:520px;
    }
}
@media(max-width:560px){
    .ss329-cta-panel{
        padding:18px;
    }
    .ss329-btn{
        min-height:76px;
        padding:15px 16px;
        gap:14px;
    }
    .ss329-btn-icon{
        width:50px;
        height:50px;
        font-size:20px;
        border-radius:16px;
    }
    .ss329-btn-title{
        font-size:15px;
    }
    .ss329-btn-sub{
        font-size:12px;
    }
}


/* Blog yan alan, kategori sekmeleri, devam butonu ve makale detay Sade uyum V3.3.0 */
.devami,
a.devami,
button.devami{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    min-height:38px!important;
    padding:9px 15px!important;
    border-radius:11px!important;
    background:linear-gradient(135deg,#4054bf,#5667d8)!important;
    color:#fff!important;
    text-decoration:none!important;
    border:1px solid rgba(64,84,191,.18)!important;
    box-shadow:0 8px 18px rgba(64,84,191,.14)!important;
    font-size:12px!important;
    font-weight:950!important;
    line-height:1!important;
}
.devami:after{
    content:"→";
    font-weight:950;
    transform:translateX(0);
    transition:transform .22s ease;
}
.devami:hover:after{
    transform:translateX(4px);
}

.ss330-blog-tabs{
    padding:12px 14px;
    border:2px solid rgba(64,84,191,.22);
    border-radius:18px;
    background:rgba(255,255,255,.46);
    box-shadow:0 14px 38px rgba(64,84,191,.06);
}
.ss330-blog-tabs a,
.ss330-blog-tabs .devami{
    min-height:38px!important;
    border-radius:999px!important;
    background:#fff!important;
    color:#4054bf!important;
    border:1px solid rgba(64,84,191,.28)!important;
    box-shadow:none!important;
}
.ss330-blog-tabs a:hover,
.ss330-blog-tabs .devami:hover{
    background:linear-gradient(135deg,#4054bf,#6b5ce7)!important;
    color:#fff!important;
    transform:translateY(-3px);
    box-shadow:0 12px 22px rgba(64,84,191,.18)!important;
}

.ss327-sidebar .ss327-side-card{
    background:rgba(255,255,255,.72)!important;
    border:2px solid rgba(64,84,191,.24)!important;
    color:#14205c!important;
    box-shadow:0 18px 45px rgba(64,84,191,.10)!important;
    backdrop-filter:blur(12px);
}
.ss327-sidebar .ss327-side-title{
    color:#14205c!important;
    font-size:14px!important;
}
.ss327-sidebar .ss327-side-title span{
    color:#fff!important;
    background:linear-gradient(135deg,#4054bf,#e91e63)!important;
}
.ss327-sidebar .ss327-side-link,
.ss327-sidebar .ss327-mini-post{
    background:#fff!important;
    color:#1f2d80!important;
    border:1px solid rgba(64,84,191,.12)!important;
    box-shadow:0 8px 18px rgba(64,84,191,.06)!important;
}
.ss327-sidebar .ss327-side-link:hover,
.ss327-sidebar .ss327-mini-post:hover{
    background:linear-gradient(135deg,#f5f7ff,#ffffff)!important;
    border-color:rgba(64,84,191,.34)!important;
    transform:translateY(-4px);
    box-shadow:0 14px 28px rgba(64,84,191,.13)!important;
}
.ss327-sidebar .ss327-side-link b{
    background:linear-gradient(135deg,#4054bf,#6b5ce7)!important;
    color:#fff!important;
}
.ss327-sidebar .ss327-mini-post i{
    color:#fff!important;
}
.ss327-sidebar .ss327-empty{
    color:#64709e!important;
}
.ss327-sidebar .ss327-cta{
    background:linear-gradient(180deg,#ffffff,#f4f6ff)!important;
    text-align:center!important;
}
.ss327-sidebar .ss327-cta h3{
    color:#14205c!important;
}
.ss327-sidebar .ss327-cta p{
    color:#64709e!important;
}
.ss327-sidebar .ss327-cta a{
    background:linear-gradient(135deg,#e91e63,#7c3aed)!important;
    color:#fff!important;
}

.ss330-detail-page{
    background:linear-gradient(180deg,#eef1ff 0%,#f8f9ff 100%);
}
.ss330-detail-hero{
    position:relative;
    min-height:430px;
    border-radius:32px;
    overflow:hidden;
    padding:28px;
    margin-bottom:24px;
    background:
        linear-gradient(90deg,rgba(19,32,92,.78),rgba(64,84,191,.36)),
        var(--hero) center/cover no-repeat;
    border:2px solid rgba(64,84,191,.42);
    box-shadow:0 25px 70px rgba(64,84,191,.18);
    color:#fff;
}
.ss330-detail-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(64,84,191,.18));
    pointer-events:none;
}
.ss330-breadcrumbs,
.ss330-hero-body,
.ss330-signal{
    position:relative;
    z-index:2;
}
.ss330-breadcrumbs{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:90px;
}
.ss330-breadcrumbs a{
    min-height:34px;
    display:inline-flex;
    align-items:center;
    padding:7px 12px;
    border-radius:999px;
    background:rgba(255,255,255,.20);
    border:1px solid rgba(255,255,255,.24);
    color:#fff!important;
    text-decoration:none!important;
    font-size:12px;
    font-weight:900;
    backdrop-filter:blur(8px);
}
.ss330-label{
    display:inline-flex;
    min-height:32px;
    align-items:center;
    padding:7px 14px;
    border-radius:999px;
    background:rgba(233,30,99,.86);
    color:#fff;
    font-size:12px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.5px;
    margin-bottom:16px;
}
.ss330-hero-body h1{
    max-width:680px;
    margin:0 0 14px;
    color:#fff;
    font-size:clamp(34px,5vw,62px);
    line-height:1.05;
    font-weight:950;
    letter-spacing:-1px;
    text-transform:none;
}
.ss330-hero-body p{
    max-width:660px;
    color:rgba(255,255,255,.88);
    font-size:17px;
    line-height:1.65;
    margin-bottom:22px;
}
.ss330-hero-meta{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    max-width:780px;
}
.ss330-hero-meta span{
    min-height:62px;
    padding:12px 14px;
    border-radius:16px;
    background:rgba(255,255,255,.18);
    border:1px solid rgba(255,255,255,.20);
    display:flex;
    flex-direction:column;
    gap:4px;
    font-weight:900;
    backdrop-filter:blur(10px);
}
.ss330-hero-meta b{
    font-size:11px;
    text-transform:uppercase;
    color:rgba(255,255,255,.66);
}
.ss330-signal{
    position:absolute;
    right:34px;
    top:50%;
    transform:translateY(-20%);
    width:150px;
    height:150px;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    background:#eef1ff;
    color:#4054bf;
    border:10px solid rgba(233,30,99,.70);
    outline:8px solid rgba(64,84,191,.28);
    box-shadow:0 18px 45px rgba(64,84,191,.24);
    text-align:center;
}
.ss330-signal strong{
    font-size:34px;
    line-height:1;
    font-weight:950;
}
.ss330-signal small{
    margin-top:4px;
    font-size:10px;
    text-transform:uppercase;
    font-weight:950;
}
.ss330-reading-card,
.ss330-related,
.ss330-comments{
    background:#fff;
    border:2px solid rgba(64,84,191,.28);
    border-radius:28px;
    box-shadow:0 18px 45px rgba(64,84,191,.08);
    overflow:hidden;
    margin-bottom:24px;
}
.ss330-reading-head,
.ss330-section-title{
    min-height:64px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    padding:18px 24px;
    border-bottom:1px solid rgba(64,84,191,.14);
    background:linear-gradient(180deg,#fbfcff,#f3f5ff);
    color:#14205c;
}
.ss330-reading-head strong,
.ss330-section-title strong{
    font-size:17px;
    font-weight:950;
    text-transform:uppercase;
}
.ss330-reading-head button,
.ss330-section-title span{
    border:1px solid rgba(64,84,191,.18);
    background:#fff;
    color:#4054bf;
    border-radius:999px;
    padding:7px 12px;
    font-size:12px;
    font-weight:900;
}
.ss330-article-content{
    padding:38px 42px;
    color:#26325f;
    font-size:17px;
    line-height:1.9;
}
.ss330-article-content h2,
.ss330-article-content h3{
    color:#14205c;
    font-weight:950;
    margin:0 0 20px;
}
.ss330-bigtext .ss330-article-content{
    font-size:19px;
}
.ss330-share-row{
    border-top:1px solid rgba(64,84,191,.12);
    padding:20px 42px 30px;
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.ss330-share-row a{
    min-height:38px;
    display:inline-flex;
    align-items:center;
    padding:8px 14px;
    border-radius:999px;
    background:#f1f4ff;
    color:#4054bf!important;
    text-decoration:none!important;
    font-weight:950;
    transition:.22s ease;
}
.ss330-share-row a:hover{
    background:#4054bf;
    color:#fff!important;
    transform:translateY(-3px);
}
.ss330-related,
.ss330-comments{
    padding-bottom:22px;
}
.ss330-related .row{
    padding:0 24px 10px;
}
.ss330-related-card{
    display:block;
    background:#fff;
    border:1px solid rgba(64,84,191,.18);
    border-radius:18px;
    overflow:hidden;
    text-decoration:none!important;
    color:#14205c!important;
    box-shadow:0 12px 28px rgba(64,84,191,.08);
    transition:.25s ease;
}
.ss330-related-card:hover{
    transform:translateY(-5px);
    box-shadow:0 18px 38px rgba(64,84,191,.16);
}
.ss330-related-card img{
    width:100%;
    height:118px;
    object-fit:cover;
    display:block;
}
.ss330-related-card b{
    display:block;
    padding:12px 14px 4px;
    font-size:14px;
    line-height:1.35;
}
.ss330-related-card small{
    display:block;
    padding:0 14px 14px;
    color:#64709e;
    font-weight:800;
}
.ss330-comment-form{
    padding:24px 28px 10px;
}
.ss330-empty-comment{
    margin:0 28px 8px;
    border:1px dashed rgba(64,84,191,.25);
    border-radius:18px;
    min-height:90px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#64709e;
    background:#f7f8ff;
    font-weight:800;
}
@media(max-width:992px){
    .ss330-signal{
        position:relative;
        right:auto;
        top:auto;
        transform:none;
        margin:24px 0 0;
        width:120px;
        height:120px;
    }
    .ss330-breadcrumbs{
        margin-bottom:45px;
    }
    .ss330-hero-meta{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}
@media(max-width:560px){
    .ss330-detail-hero{
        min-height:auto;
        padding:22px;
    }
    .ss330-hero-body h1{
        font-size:32px;
    }
    .ss330-hero-meta{
        grid-template-columns:1fr;
    }
    .ss330-article-content{
        padding:28px 22px;
    }
    .ss330-share-row{
        padding:18px 22px 26px;
    }
}


/* Blog Yazıları Sade BlogX V3.3.1 - kaynak görünüme yakın, Sade renklere uyumlu */
.ss331-blogx-wrap{
    max-width:1340px;
    margin:0 auto;
    padding:42px 28px 72px;
    position:relative;
    z-index:1;
    color:#14205c;
}
.ss331-blogx-wrap *:not(i){
    font-family:Arial,Helvetica,sans-serif;
}
.ss331-blogx-hero{
    position:relative;
    overflow:hidden;
    border-radius:32px;
    padding:30px;
    margin-bottom:22px;
    background:
        radial-gradient(circle at 16% 8%,rgba(233,30,99,.12),transparent 32%),
        radial-gradient(circle at 84% 12%,rgba(64,84,191,.14),transparent 30%),
        linear-gradient(135deg,rgba(255,255,255,.96),rgba(241,244,255,.94));
    border:2px solid rgba(64,84,191,.24);
    box-shadow:0 24px 65px rgba(64,84,191,.12), inset 0 1px 0 rgba(255,255,255,.8);
}
.ss331-blogx-hero:before{
    content:"";
    position:absolute;
    inset:0;
    background-image:radial-gradient(circle,rgba(64,84,191,.10) 1px,transparent 1.8px);
    background-size:22px 22px;
    opacity:.22;
    pointer-events:none;
}
.ss331-blogx-hero:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:3px;
    background:linear-gradient(90deg,#4054bf,#6a55dc,#e91e63,#4aa3ff);
    opacity:.95;
}
.ss331-blogx-hero-in{
    position:relative;
    z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:24px;
    align-items:center;
}
.ss331-blogx-kicker{
    display:inline-flex;
    align-items:center;
    gap:9px;
    padding:8px 13px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(64,84,191,.16);
    color:#4054bf;
    font-size:11px;
    font-weight:950;
    letter-spacing:.8px;
    text-transform:uppercase;
    margin-bottom:14px;
    box-shadow:0 8px 18px rgba(64,84,191,.08);
}
.ss331-blogx-kicker i{
    color:#e91e63;
    filter:drop-shadow(0 0 8px rgba(233,30,99,.35));
}
.ss331-blogx-title{
    font-size:clamp(32px,4vw,58px);
    line-height:.98;
    margin:0;
    color:#14205c;
    font-weight:950;
    letter-spacing:-1.8px;
}
.ss331-blogx-title span{
    background:linear-gradient(90deg,#4054bf,#6a55dc,#e91e63);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.ss331-blogx-sub{
    max-width:720px;
    color:#64709e;
    font-size:14px;
    line-height:1.72;
    margin:14px 0 0;
}
.ss331-blogx-searchbar{
    display:flex;
    align-items:center;
    gap:10px;
    max-width:560px;
    margin-top:20px;
    padding:8px;
    border-radius:22px;
    background:#fff;
    border:1px solid rgba(64,84,191,.20);
    box-shadow:0 14px 30px rgba(64,84,191,.08);
}
.ss331-blogx-searchbar i{
    width:42px;
    height:42px;
    border-radius:15px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#4054bf,#6a55dc);
    color:#fff;
    flex:0 0 42px;
}
.ss331-blogx-searchbar input{
    width:100%;
    height:42px;
    border:0;
    outline:0;
    background:transparent;
    color:#14205c;
    font-size:14px;
    font-weight:800;
}
.ss331-blogx-searchbar input::placeholder{color:#7b86ad}
.ss331-blogx-searchbar button{
    height:42px;
    min-width:42px;
    border:0;
    border-radius:15px;
    background:#eef1ff;
    color:#4054bf;
    font-weight:950;
    cursor:pointer;
}
.ss331-blogx-hero-orb{
    position:relative;
    z-index:2;
    width:190px;
    height:190px;
    display:grid;
    place-items:center;
    justify-self:end;
    margin-right:8px;
}
.ss331-blogx-hero-orb:before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:50%;
    border:1px dashed rgba(64,84,191,.25);
    animation:ss331OrbSpin 18s linear infinite;
}
.ss331-blogx-hero-orb:after{
    content:"";
    position:absolute;
    inset:22px;
    border-radius:50%;
    border:1px solid rgba(106,85,220,.22);
    box-shadow:0 0 48px rgba(64,84,191,.10),inset 0 0 40px rgba(233,30,99,.08);
}
.ss331-blogx-orb-ring{
    position:absolute;
    inset:42px;
    border-radius:50%;
    background:radial-gradient(circle,rgba(64,84,191,.08),transparent 68%);
    border:1px solid rgba(64,84,191,.18);
    box-shadow:0 0 34px rgba(64,84,191,.12);
}
.ss331-blogx-orb-core{
    position:relative;
    width:88px;
    height:88px;
    border-radius:28px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#4054bf,#6a55dc);
    box-shadow:0 18px 40px rgba(64,84,191,.24),0 0 40px rgba(106,85,220,.20);
    border:1px solid rgba(255,255,255,.60);
}
.ss331-blogx-orb-core i{font-size:34px;color:#fff}
.ss331-blogx-orb-dot{
    position:absolute;
    width:8px;
    height:8px;
    border-radius:50%;
    background:#e91e63;
    box-shadow:0 0 16px rgba(233,30,99,.65);
}
.ss331-blogx-orb-dot.d1{top:28px;right:58px}
.ss331-blogx-orb-dot.d2{left:40px;bottom:46px;background:#4aa3ff;box-shadow:0 0 16px rgba(74,163,255,.6)}
.ss331-blogx-orb-dot.d3{right:36px;bottom:58px;background:#2fc46a;box-shadow:0 0 16px rgba(47,196,106,.6)}
@keyframes ss331OrbSpin{to{transform:rotate(360deg)}}
.ss331-blogx-hero:hover .ss331-blogx-orb-core{
    transform:translateY(-4px) scale(1.04);
    transition:.28s ease;
}

.ss331-blogx-tools{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:14px;
    margin:0 0 22px;
    flex-wrap:wrap;
}
.ss331-blogx-cats,
.ss331-blogx-sort,
.ss331-blogx-view{
    display:flex;
    align-items:center;
    gap:8px;
    flex-wrap:wrap;
}
.ss331-blogx-tool-title{
    height:38px;
    padding:0 12px;
    border-radius:999px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:#fff;
    border:1px solid rgba(64,84,191,.16);
    color:#64709e;
    font-size:11px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.6px;
    box-shadow:0 8px 18px rgba(64,84,191,.05);
}
.ss331-blogx-chip,
.ss331-blogx-sort-btn,
.ss331-blogx-view-btn{
    height:38px;
    display:inline-flex;
    align-items:center;
    gap:8px;
    padding:0 14px;
    border-radius:999px;
    background:#fff;
    border:1px solid rgba(64,84,191,.17);
    color:#4054bf;
    text-decoration:none!important;
    font-size:12px;
    font-weight:900;
    cursor:pointer;
    transition:.24s ease;
    box-shadow:0 8px 18px rgba(64,84,191,.05);
}
.ss331-blogx-chip:hover,
.ss331-blogx-sort-btn:hover,
.ss331-blogx-view-btn:hover,
.ss331-blogx-chip.active,
.ss331-blogx-sort-btn.active,
.ss331-blogx-view-btn.active{
    transform:translateY(-2px);
    background:linear-gradient(135deg,#4054bf,#6a55dc);
    border-color:rgba(64,84,191,.35);
    color:#fff!important;
    box-shadow:0 12px 28px rgba(64,84,191,.16);
}
.ss331-blogx-chip .count{
    padding:2px 7px;
    border-radius:999px;
    background:rgba(64,84,191,.10);
    font-size:10px;
    color:inherit;
}
.ss331-blogx-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 360px;
    gap:24px;
    align-items:start;
}
.ss331-blogx-main{min-width:0}
.ss331-blogx-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:18px;
    margin-bottom:28px;
}
.ss331-blogx-grid.list{grid-template-columns:1fr}
.ss331-blogx-grid.list .ss331-blogx-card{
    display:grid;
    grid-template-columns:260px 1fr;
    min-height:250px;
}
.ss331-blogx-grid.list .ss331-blogx-img{height:100%}
.ss331-blogx-card{
    position:relative;
    overflow:hidden;
    border-radius:26px;
    background:#fff;
    border:2px solid rgba(64,84,191,.18);
    box-shadow:0 18px 45px rgba(64,84,191,.10),inset 0 1px 0 rgba(255,255,255,.8);
    transition:.28s;
    cursor:pointer;
    isolation:isolate;
}
.ss331-blogx-card:before{
    content:"";
    position:absolute;
    inset:0;
    background:radial-gradient(480px 220px at var(--mx,50%) var(--my,0%),rgba(233,30,99,.10),transparent 68%);
    opacity:0;
    transition:.28s;
    z-index:2;
    pointer-events:none;
}
.ss331-blogx-card:after{
    content:"";
    position:absolute;
    left:0;
    right:0;
    bottom:0;
    height:3px;
    background:linear-gradient(90deg,#4054bf,#6a55dc,#e91e63);
    opacity:0;
    transition:.28s;
    z-index:3;
}
.ss331-blogx-card:hover{
    transform:translateY(-7px);
    border-color:rgba(64,84,191,.34);
    box-shadow:0 28px 70px rgba(64,84,191,.16),0 0 35px rgba(106,85,220,.08);
}
.ss331-blogx-card:hover:before,
.ss331-blogx-card:hover:after{opacity:1}
.ss331-blogx-img{
    height:220px;
    position:relative;
    overflow:hidden;
    background:#e8edff;
}
.ss331-blogx-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    transition:transform .65s ease,filter .65s ease;
}
.ss331-blogx-card:hover .ss331-blogx-img img{
    transform:scale(1.08);
    filter:saturate(1.08) contrast(1.02);
}
.ss331-blogx-img:after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 34%,rgba(20,32,92,.62));
    z-index:1;
}
.ss331-blogx-badges{
    position:absolute;
    left:13px;
    right:13px;
    bottom:13px;
    z-index:2;
    display:flex;
    align-items:center;
    gap:7px;
    flex-wrap:wrap;
}
.ss331-blogx-badge{
    display:inline-flex;
    align-items:center;
    gap:5px;
    min-height:27px;
    padding:0 10px;
    border-radius:999px;
    background:rgba(255,255,255,.86);
    border:1px solid rgba(255,255,255,.50);
    backdrop-filter:blur(10px);
    color:#4054bf;
    font-size:10px;
    font-weight:950;
}
.ss331-blogx-badge.read{margin-left:auto;color:#14205c}
.ss331-blogx-body{
    padding:18px 18px 17px;
    position:relative;
    z-index:4;
}
.ss331-blogx-cat{
    display:flex;
    align-items:center;
    gap:8px;
    color:#4054bf;
    font-size:11px;
    font-weight:950;
    letter-spacing:.6px;
    text-transform:uppercase;
    margin-bottom:10px;
}
.ss331-blogx-cat:before{
    content:"";
    width:6px;
    height:6px;
    border-radius:50%;
    background:#e91e63;
    box-shadow:0 0 9px rgba(233,30,99,.45);
}
.ss331-blogx-card-title{
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
    min-height:52px;
    color:#14205c;
    text-decoration:none!important;
    font-size:19px;
    font-weight:950;
    line-height:1.34;
    letter-spacing:-.3px;
    transition:.25s;
}
.ss331-blogx-card:hover .ss331-blogx-card-title{color:#4054bf}
.ss331-blogx-excerpt{
    margin:11px 0 0;
    color:#64709e;
    font-size:13px;
    line-height:1.65;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.ss331-blogx-foot{
    display:flex;
    align-items:center;
    gap:10px;
    flex-wrap:wrap;
    margin-top:16px;
    padding-top:13px;
    border-top:1px solid rgba(64,84,191,.14);
}
.ss331-blogx-meta{
    display:inline-flex;
    align-items:center;
    gap:6px;
    color:#64709e;
    font-size:11px;
    font-weight:800;
}
.ss331-blogx-meta i{color:#e91e63}
.ss331-blogx-read{
    margin-left:auto;
    display:inline-flex;
    align-items:center;
    gap:8px;
    height:36px;
    padding:0 14px;
    border-radius:999px;
    text-decoration:none!important;
    background:linear-gradient(135deg,#4054bf,#6a55dc);
    border:1px solid rgba(64,84,191,.20);
    color:#fff!important;
    font-size:12px;
    font-weight:950;
    transition:.24s;
}
.ss331-blogx-read:hover{
    transform:translateY(-2px);
    box-shadow:0 14px 26px rgba(64,84,191,.18);
}
.ss331-blogx-sidebar{
    position:sticky;
    top:14px;
    display:flex;
    flex-direction:column;
    gap:16px;
}
.ss331-blogx-side-card{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:#fff;
    border:2px solid rgba(64,84,191,.18);
    box-shadow:0 18px 45px rgba(64,84,191,.10);
}
.ss331-blogx-side-card:before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:3px;
    background:linear-gradient(90deg,#4054bf,#6a55dc,#e91e63);
}
.ss331-blogx-side-head{
    display:flex;
    align-items:center;
    gap:12px;
    padding:16px 17px;
    border-bottom:1px solid rgba(64,84,191,.14);
    background:#f7f8ff;
}
.ss331-blogx-side-ico{
    width:38px;
    height:38px;
    border-radius:13px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#4054bf,#6a55dc);
    color:#fff;
    box-shadow:0 10px 22px rgba(64,84,191,.20);
}
.ss331-blogx-side-head h4{
    margin:0;
    color:#14205c;
    font-size:14px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.5px;
}
.ss331-blogx-side-list{
    padding:12px;
    display:flex;
    flex-direction:column;
    gap:9px;
}
.ss331-blogx-side-link{
    display:flex;
    align-items:center;
    gap:10px;
    padding:10px;
    border-radius:15px;
    background:#f7f8ff;
    border:1px solid rgba(64,84,191,.12);
    text-decoration:none!important;
    color:#14205c!important;
    transition:.22s;
}
.ss331-blogx-side-link:hover{
    transform:translateX(4px);
    border-color:rgba(64,84,191,.34);
    background:#fff;
    box-shadow:0 10px 22px rgba(64,84,191,.09);
}
.ss331-blogx-side-link i{
    width:30px;
    height:30px;
    border-radius:10px;
    display:grid;
    place-items:center;
    background:#fff;
    color:#4054bf;
    font-size:12px;
    flex:0 0 30px;
}
.ss331-blogx-side-link span.name{
    flex:1;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    font-size:13px;
    font-weight:950;
}
.ss331-blogx-side-count{
    font-size:11px;
    font-weight:950;
    color:#fff;
    padding:3px 8px;
    border-radius:999px;
    background:#4054bf;
}
.ss331-blogx-pop-item{
    display:grid;
    grid-template-columns:34px 58px 1fr;
    align-items:center;
    gap:10px;
    padding:10px;
    border-radius:15px;
    background:#f7f8ff;
    border:1px solid rgba(64,84,191,.12);
    text-decoration:none!important;
    transition:.22s;
}
.ss331-blogx-pop-item:hover{
    transform:translateX(4px);
    border-color:rgba(233,30,99,.34);
    background:#fff;
    box-shadow:0 10px 22px rgba(64,84,191,.09);
}
.ss331-blogx-pop-rank{
    width:30px;
    height:30px;
    border-radius:11px;
    display:grid;
    place-items:center;
    font-weight:950;
    font-size:12px;
    background:#e8edff;
    color:#4054bf;
}
.ss331-blogx-pop-rank.r1{background:linear-gradient(135deg,#ffbd32,#ff8b35);color:#111}
.ss331-blogx-pop-rank.r2{background:linear-gradient(135deg,#dfe7ff,#8aa6c8);color:#111}
.ss331-blogx-pop-rank.r3{background:linear-gradient(135deg,#ce7b39,#f3b77f);color:#111}
.ss331-blogx-pop-img{
    width:58px;
    height:46px;
    border-radius:12px;
    overflow:hidden;
}
.ss331-blogx-pop-img img{width:100%;height:100%;object-fit:cover}
.ss331-blogx-pop-title{
    display:block;
    color:#14205c;
    font-size:12px;
    font-weight:950;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}
.ss331-blogx-pop-view{
    display:block;
    margin-top:4px;
    color:#64709e;
    font-size:10px;
    font-weight:800;
}
.ss331-blogx-empty-mini{
    min-height:95px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#64709e;
    font-size:13px;
    font-weight:800;
}
.ss331-blogx-cta{
    padding:24px 20px;
    text-align:center;
}
.ss331-blogx-cta-icon{
    width:62px;
    height:62px;
    margin:0 auto 13px;
    border-radius:21px;
    display:grid;
    place-items:center;
    background:linear-gradient(135deg,#e91e63,#6a55dc);
    color:#fff;
    font-size:25px;
    box-shadow:0 14px 30px rgba(233,30,99,.18);
}
.ss331-blogx-cta-title{
    font-size:20px;
    font-weight:950;
    color:#14205c;
}
.ss331-blogx-cta-text{
    color:#64709e;
    font-size:13px;
    line-height:1.55;
    margin:8px 0 16px;
}
.ss331-blogx-cta-btn{
    display:inline-flex;
    align-items:center;
    gap:8px;
    height:42px;
    padding:0 20px;
    border-radius:999px;
    text-decoration:none!important;
    background:linear-gradient(135deg,#4054bf,#e91e63);
    color:#fff!important;
    font-weight:950;
    font-size:13px;
    box-shadow:0 15px 30px rgba(233,30,99,.16);
}
.ss331-blogx-empty{
    grid-column:1/-1;
    min-height:240px;
    border-radius:26px;
    border:2px dashed rgba(64,84,191,.22);
    background:rgba(255,255,255,.55);
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    gap:12px;
    color:#64709e;
    margin-bottom:22px;
}
.ss331-blogx-empty i{font-size:44px;color:#e91e63;opacity:.65}
.ss331-blog-pager-wrap{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:7px;
    flex-wrap:wrap;
    margin:2px 0 34px;
}
.ss331-bp-btn{
    min-width:40px;
    height:40px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:0 13px;
    border-radius:13px;
    background:#fff;
    border:1px solid rgba(64,84,191,.18);
    color:#4054bf;
    text-decoration:none!important;
    font-weight:950;
    font-size:13px;
    transition:.22s;
}
.ss331-bp-btn:hover:not(.ss331-bp-active){
    transform:translateY(-2px);
    border-color:rgba(64,84,191,.35);
    background:#f7f8ff;
}
.ss331-bp-active{
    height:46px;
    min-width:46px;
    background:linear-gradient(135deg,#4054bf,#6a55dc,#e91e63);
    color:#fff;
    box-shadow:0 14px 30px rgba(106,85,220,.18);
}
@media(max-width:1180px){
    .ss331-blogx-layout{grid-template-columns:1fr}
    .ss331-blogx-sidebar{
        position:relative;
        top:auto;
        display:grid;
        grid-template-columns:repeat(2,1fr);
    }
    .ss331-blogx-side-card:last-child{grid-column:1/-1}
}
@media(max-width:860px){
    .ss331-blogx-wrap{padding:28px 14px 50px}
    .ss331-blogx-hero{padding:20px;border-radius:24px}
    .ss331-blogx-hero-in{grid-template-columns:1fr}
    .ss331-blogx-hero-orb{justify-self:center;width:150px;height:150px;margin:0}
    .ss331-blogx-orb-core{width:74px;height:74px;border-radius:24px}
    .ss331-blogx-orb-core i{font-size:28px}
    .ss331-blogx-grid{grid-template-columns:1fr}
    .ss331-blogx-grid.list .ss331-blogx-card{grid-template-columns:1fr}
    .ss331-blogx-grid.list .ss331-blogx-img{height:220px}
    .ss331-blogx-tools{align-items:flex-start}
    .ss331-blogx-sidebar{grid-template-columns:1fr}
    .ss331-blogx-title{font-size:36px}
    .ss331-blogx-searchbar{max-width:none}
    .ss331-blogx-card-title{font-size:18px}
}
@media(max-width:520px){
    .ss331-blogx-searchbar{gap:6px}
    .ss331-blogx-chip,
    .ss331-blogx-sort-btn,
    .ss331-blogx-view-btn{font-size:11px;padding:0 11px}
    .ss331-blogx-foot{display:block}
    .ss331-blogx-read{margin:12px 0 0}
    .ss331-blogx-img{height:185px}
}


/* Makale detay premium hero V3.3.2 */
.ss330-detail-page{
    background:
        radial-gradient(circle at 9% 10%,rgba(64,84,191,.09),transparent 28%),
        radial-gradient(circle at 92% 0%,rgba(233,30,99,.08),transparent 30%),
        linear-gradient(180deg,#eef1ff 0%,#f8f9ff 100%)!important;
}
.ss330-detail-hero{
    min-height:520px!important;
    border-radius:34px!important;
    padding:34px 36px!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background:
        linear-gradient(115deg,rgba(31,45,128,.88) 0%,rgba(64,84,191,.70) 42%,rgba(238,241,255,.42) 100%),
        var(--hero) center/cover no-repeat!important;
    border:2px solid rgba(64,84,191,.55)!important;
    box-shadow:
        0 30px 80px rgba(64,84,191,.20),
        inset 0 1px 0 rgba(255,255,255,.24)!important;
}
.ss330-detail-hero:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    background:
        radial-gradient(circle at 82% 18%,rgba(255,255,255,.34),transparent 22%),
        radial-gradient(circle at 12% 92%,rgba(233,30,99,.18),transparent 28%),
        linear-gradient(180deg,rgba(255,255,255,.06),rgba(64,84,191,.14))!important;
    pointer-events:none!important;
}
.ss330-detail-hero:after{
    content:""!important;
    position:absolute!important;
    right:-115px!important;
    top:-105px!important;
    width:430px!important;
    height:430px!important;
    z-index:0!important;
    border-radius:50%!important;
    background:
        conic-gradient(from 120deg,rgba(64,84,191,.36),rgba(233,30,99,.30),rgba(255,255,255,.30),rgba(64,84,191,.36))!important;
    filter:blur(5px)!important;
    opacity:.72!important;
    animation:ss332Spin 18s linear infinite!important;
}
@keyframes ss332Spin{to{transform:rotate(360deg)}}

.ss330-breadcrumbs,
.ss330-hero-body,
.ss330-signal{
    position:relative!important;
    z-index:2!important;
}
.ss330-breadcrumbs{
    margin-bottom:80px!important;
}
.ss330-breadcrumbs a{
    min-height:38px!important;
    padding:8px 14px!important;
    border-radius:999px!important;
    background:rgba(255,255,255,.18)!important;
    border:1px solid rgba(255,255,255,.34)!important;
    color:#fff!important;
    box-shadow:0 10px 22px rgba(31,45,128,.14)!important;
    transition:.24s ease!important;
}
.ss330-breadcrumbs a:hover{
    transform:translateY(-3px)!important;
    background:#fff!important;
    color:#4054bf!important;
}

.ss330-label{
    min-height:40px!important;
    gap:9px!important;
    padding:9px 17px!important;
    border-radius:999px!important;
    background:linear-gradient(135deg,#e91e63,#ff5b93)!important;
    box-shadow:0 16px 32px rgba(233,30,99,.26)!important;
}
.ss330-label:before{
    content:"✦";
    font-size:14px;
}

.ss330-hero-body h1{
    max-width:760px!important;
    margin-bottom:18px!important;
    font-size:clamp(44px,5.8vw,76px)!important;
    line-height:.98!important;
    letter-spacing:-2.2px!important;
    text-shadow:0 12px 34px rgba(31,45,128,.22)!important;
}
.ss330-hero-body h1:after{
    content:"";
    display:block;
    width:min(360px,55%);
    height:8px;
    margin-top:18px;
    border-radius:999px;
    background:linear-gradient(90deg,#fff,#ff5b93,#4054bf);
    box-shadow:0 12px 28px rgba(233,30,99,.18);
}
.ss330-hero-body p{
    max-width:760px!important;
    font-size:19px!important;
    font-weight:700!important;
    line-height:1.72!important;
    color:rgba(255,255,255,.93)!important;
    text-shadow:0 8px 24px rgba(31,45,128,.18)!important;
}

.ss332-hero-meta,
.ss330-hero-meta{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    max-width:920px!important;
    gap:14px!important;
}
.ss332-hero-meta span,
.ss330-hero-meta span{
    position:relative!important;
    overflow:hidden!important;
    min-height:78px!important;
    padding:14px 15px!important;
    border-radius:18px!important;
    background:rgba(255,255,255,.22)!important;
    border:1px solid rgba(255,255,255,.34)!important;
    box-shadow:0 14px 34px rgba(31,45,128,.16), inset 0 1px 0 rgba(255,255,255,.22)!important;
}
.ss332-hero-meta span:before,
.ss330-hero-meta span:before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:4px;
    background:linear-gradient(90deg,#fff,#ff5b93,#4054bf);
}
.ss332-hero-meta i{
    width:26px;
    height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:rgba(255,255,255,.24);
    font-style:normal;
    margin-bottom:2px;
}
.ss330-hero-meta b{
    font-size:10px!important;
    letter-spacing:.7px!important;
    color:rgba(255,255,255,.70)!important;
}
.ss330-hero-meta span{
    color:#fff!important;
    font-size:18px!important;
    font-weight:950!important;
}

.ss332-hero-actions{
    position:relative;
    z-index:3;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:24px;
}
.ss332-hero-btn{
    min-height:48px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:12px 20px;
    border-radius:999px;
    text-decoration:none!important;
    font-weight:950;
    transition:.24s ease;
}
.ss332-hero-btn.primary{
    background:linear-gradient(135deg,#e91e63,#7c3aed);
    color:#fff!important;
    box-shadow:0 16px 32px rgba(233,30,99,.23);
}
.ss332-hero-btn.ghost{
    background:rgba(255,255,255,.20);
    border:1px solid rgba(255,255,255,.36);
    color:#fff!important;
}
.ss332-hero-btn:hover{
    transform:translateY(-4px);
    filter:saturate(1.08);
}

.ss330-signal{
    right:38px!important;
    top:46%!important;
    width:178px!important;
    height:178px!important;
    background:rgba(255,255,255,.84)!important;
    color:#4054bf!important;
    border:0!important;
    outline:0!important;
    box-shadow:0 24px 58px rgba(31,45,128,.20)!important;
}
.ss330-signal:before{
    content:"";
    position:absolute;
    inset:-18px;
    border-radius:50%;
    background:conic-gradient(#e91e63,#ff7aa8,#4054bf,#e91e63);
    z-index:-1;
    animation:ss332Spin 12s linear infinite;
}
.ss330-signal:after{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:50%;
    background:rgba(238,241,255,.65);
    z-index:-1;
}
.ss330-signal strong{
    font-size:40px!important;
    background:linear-gradient(135deg,#4054bf,#e91e63);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
}
.ss330-signal small{
    color:#4054bf!important;
    font-size:11px!important;
    letter-spacing:.5px!important;
}

@media(max-width:992px){
    .ss330-detail-hero{
        min-height:auto!important;
        padding:26px!important;
    }
    .ss330-hero-body h1{
        font-size:42px!important;
        letter-spacing:-1.3px!important;
    }
    .ss332-hero-meta,
    .ss330-hero-meta{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
    }
    .ss330-signal{
        margin-top:28px!important;
        width:138px!important;
        height:138px!important;
    }
}
@media(max-width:560px){
    .ss330-hero-body h1{
        font-size:34px!important;
    }
    .ss332-hero-meta,
    .ss330-hero-meta{
        grid-template-columns:1fr!important;
    }
    .ss330-breadcrumbs{
        margin-bottom:44px!important;
    }
}


/* Beyaz sayfa fix + geniş makale hero V3.3.4 */
.ss334-detail-container{
    max-width:1320px!important;
}
.ss334-detail-row{
    align-items:flex-start!important;
}
.ss334-main-col{
    width:75%!important;
    max-width:75%!important;
    flex:0 0 75%!important;
    padding-right:22px!important;
}
.ss334-detail-page .ss327-sidebar{
    width:25%!important;
    max-width:25%!important;
    flex:0 0 25%!important;
}
.ss334-detail-hero{
    min-height:560px!important;
    border-radius:36px!important;
    padding:34px 40px 38px!important;
    margin-bottom:28px!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
    isolation:isolate!important;
    overflow:hidden!important;
    background:
        linear-gradient(90deg,rgba(32,45,125,.90) 0%,rgba(64,84,191,.64) 44%,rgba(238,241,255,.14) 100%),
        var(--hero) center center/cover no-repeat!important;
    border:2px solid rgba(64,84,191,.55)!important;
    box-shadow:
        0 34px 88px rgba(64,84,191,.22),
        0 10px 25px rgba(233,30,99,.07),
        inset 0 1px 0 rgba(255,255,255,.24)!important;
}
.ss334-detail-hero:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:0!important;
    background:
        linear-gradient(90deg,rgba(31,45,128,.42) 0%,rgba(31,45,128,.22) 45%,rgba(255,255,255,.10) 100%),
        radial-gradient(circle at 72% 32%,rgba(255,255,255,.34),transparent 19%),
        radial-gradient(circle at 83% 80%,rgba(233,30,99,.16),transparent 26%)!important;
    pointer-events:none!important;
}
.ss334-detail-hero:after{
    content:""!important;
    position:absolute!important;
    right:-145px!important;
    top:-135px!important;
    width:500px!important;
    height:500px!important;
    z-index:0!important;
    border-radius:50%!important;
    background:conic-gradient(from 120deg,rgba(64,84,191,.36),rgba(233,30,99,.30),rgba(255,255,255,.30),rgba(64,84,191,.36))!important;
    filter:blur(5px)!important;
    opacity:.58!important;
    animation:ss332Spin 18s linear infinite!important;
}
.ss334-hero-body{
    max-width:850px!important;
    position:relative!important;
    z-index:2!important;
}
.ss334-hero-body h1{
    max-width:850px!important;
    font-size:clamp(50px,6.2vw,86px)!important;
    line-height:.96!important;
    letter-spacing:-2.7px!important;
}
.ss334-hero-body h1:after{
    content:"";
    display:block;
    width:min(420px,58%)!important;
    height:9px!important;
    margin-top:18px;
    border-radius:999px;
    background:linear-gradient(90deg,#fff,#ff5b93,#4054bf);
    box-shadow:0 12px 28px rgba(233,30,99,.18);
}
.ss334-hero-body p{
    max-width:800px!important;
    font-size:20px!important;
    line-height:1.75!important;
}
.ss334-hero-meta{
    max-width:960px!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:14px!important;
}
.ss334-hero-meta span{
    position:relative!important;
    overflow:hidden!important;
    min-height:86px!important;
    border-radius:20px!important;
}
.ss334-hero-meta i{
    width:26px;
    height:26px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:10px;
    background:rgba(255,255,255,.24);
    font-style:normal;
    margin-bottom:2px;
}
.ss334-hero-actions{
    position:relative;
    z-index:3;
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:28px!important;
}
.ss334-hero-btn{
    min-height:52px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    padding:13px 23px;
    border-radius:999px;
    text-decoration:none!important;
    font-weight:950;
    transition:.24s ease;
}
.ss334-hero-btn.primary{
    background:linear-gradient(135deg,#e91e63,#7c3aed);
    color:#fff!important;
    box-shadow:0 16px 32px rgba(233,30,99,.23);
}
.ss334-hero-btn.ghost{
    background:rgba(255,255,255,.20);
    border:1px solid rgba(255,255,255,.36);
    color:#fff!important;
}
.ss334-hero-btn:hover{
    transform:translateY(-4px);
}
.ss334-signal{
    right:46px!important;
    top:50%!important;
    width:190px!important;
    height:190px!important;
}
.ss334-signal strong{
    font-size:46px!important;
}
.ss334-article-content{
    padding:44px 54px!important;
    font-size:18px!important;
    line-height:1.95!important;
}
.ss334-article-content h2{
    font-size:34px!important;
    line-height:1.18!important;
}
.ss334-detail-page .ss327-sidebar .ss327-side-card{
    border-radius:20px!important;
    margin-bottom:14px!important;
    padding:14px!important;
}
.ss334-detail-page .ss327-sidebar .ss327-side-link{
    min-height:38px!important;
    font-size:12px!important;
}
.ss334-detail-page .ss327-sidebar .ss327-mini-post{
    min-height:40px!important;
}
.ss334-detail-page .ss327-sidebar .ss327-mini-post span{
    font-size:11px!important;
}
@media(max-width:1199px){
    .ss334-detail-page .ss327-sidebar,
    .ss334-main-col{
        width:100%!important;
        max-width:100%!important;
        flex:0 0 100%!important;
    }
    .ss334-main-col{
        padding-right:0!important;
    }
    .ss334-detail-page .ss327-sidebar{
        margin-top:24px!important;
    }
}
@media(max-width:992px){
    .ss334-detail-hero{
        min-height:auto!important;
        padding:28px!important;
    }
    .ss334-hero-body h1{
        font-size:42px!important;
        letter-spacing:-1.4px!important;
    }
    .ss334-signal{
        width:140px!important;
        height:140px!important;
        right:auto!important;
        top:auto!important;
    }
    .ss334-article-content{
        padding:32px 26px!important;
        font-size:17px!important;
    }
}
@media(max-width:560px){
    .ss334-detail-container{
        max-width:calc(100% - 20px)!important;
    }
    .ss334-detail-hero{
        border-radius:26px!important;
        padding:22px!important;
    }
    .ss334-hero-body h1{
        font-size:34px!important;
        letter-spacing:-1px!important;
    }
    .ss334-hero-meta{
        grid-template-columns:1fr!important;
    }
}


/* SesliYoutube EC benzeri makale detay - Sohbet uyum V3.3.5 */
.ss335-page{
    position:relative;
    padding:38px 0 80px;
    background:
        radial-gradient(circle at 12% 0%,rgba(64,84,191,.13),transparent 28%),
        radial-gradient(circle at 88% 6%,rgba(233,30,99,.10),transparent 32%),
        linear-gradient(180deg,#eef1ff 0%,#f7f8ff 54%,#eef2ff 100%);
}
.ss335-wrap{
    width:min(1320px,calc(100% - 34px));
    margin:0 auto;
}
.ss335-layout{
    display:grid;
    grid-template-columns:minmax(0,1fr) 340px;
    gap:24px;
    align-items:start;
}
.ss335-main{min-width:0}
.ss335-alert{
    background:#fff;
    border:2px dashed rgba(233,30,99,.35);
    color:#9f1239;
    border-radius:22px;
    padding:22px;
    font-weight:900;
}
.ss335-hero{
    position:relative;
    min-height:520px;
    border-radius:34px;
    overflow:hidden;
    border:2px solid rgba(64,84,191,.45);
    background:
        linear-gradient(90deg,rgba(31,45,128,.76),rgba(64,84,191,.40)),
        var(--ss335-img) center/cover no-repeat;
    box-shadow:0 30px 84px rgba(64,84,191,.20);
    isolation:isolate;
    padding:26px;
    margin-bottom:22px;
}
.ss335-hero-bg{
    position:absolute;inset:0;z-index:0;
    background:
        linear-gradient(180deg,rgba(255,255,255,.10),rgba(64,84,191,.16)),
        radial-gradient(circle at 77% 24%,rgba(255,255,255,.28),transparent 22%),
        radial-gradient(circle at 14% 92%,rgba(233,30,99,.18),transparent 30%);
}
.ss335-hero:after{
    content:"";
    position:absolute;
    right:-120px;top:-120px;
    width:420px;height:420px;
    border-radius:50%;
    background:conic-gradient(from 130deg,#4054bf,#e91e63,#7c3aed,#38bdf8,#4054bf);
    filter:blur(12px);
    opacity:.42;
    z-index:0;
    animation:ss335Spin 18s linear infinite;
}
@keyframes ss335Spin{to{transform:rotate(360deg)}}
.ss335-crumbs{
    position:relative;z-index:2;
    display:flex;flex-wrap:wrap;gap:9px;
    margin-bottom:115px;
}
.ss335-crumbs a{
    min-height:38px;
    display:inline-flex;align-items:center;gap:7px;
    padding:8px 14px;
    border-radius:999px;
    color:#fff!important;
    background:rgba(255,255,255,.20);
    border:1px solid rgba(255,255,255,.26);
    text-decoration:none!important;
    font-weight:950;
    font-size:12px;
    backdrop-filter:blur(10px);
    transition:.24s ease;
}
.ss335-crumbs a:hover{transform:translateY(-3px);background:#fff;color:#4054bf!important}
.ss335-hero-grid{
    position:relative;z-index:2;
    display:grid;
    grid-template-columns:minmax(0,1fr) 240px;
    gap:26px;
    align-items:end;
}
.ss335-kicker{
    display:inline-flex;align-items:center;gap:8px;
    min-height:38px;
    padding:9px 15px;
    border-radius:999px;
    background:linear-gradient(135deg,#e91e63,#ff5b93);
    color:#fff;
    font-size:12px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.5px;
    box-shadow:0 14px 30px rgba(233,30,99,.24);
    margin-bottom:18px;
}
.ss335-hero-text h1{
    max-width:760px;
    margin:0 0 18px;
    color:#fff;
    font-size:clamp(42px,5.4vw,78px);
    line-height:.98;
    letter-spacing:-2.2px;
    font-weight:950;
    text-shadow:0 16px 34px rgba(31,45,128,.26);
}
.ss335-hero-text h1:after{
    content:"";
    display:block;
    width:min(390px,58%);
    height:8px;
    border-radius:999px;
    margin-top:17px;
    background:linear-gradient(90deg,#fff,#e91e63,#4054bf);
}
.ss335-hero-text p{
    max-width:760px;
    color:rgba(255,255,255,.92);
    font-size:18px;
    line-height:1.68;
    font-weight:750;
    margin:0 0 20px;
}
.ss335-meta-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
}
.ss335-meta-grid div{
    min-height:76px;
    position:relative;
    overflow:hidden;
    padding:13px 14px;
    border-radius:17px;
    background:rgba(255,255,255,.20);
    border:1px solid rgba(255,255,255,.28);
    color:#fff;
    backdrop-filter:blur(12px);
    box-shadow:0 12px 26px rgba(31,45,128,.14);
}
.ss335-meta-grid div:before{
    content:"";position:absolute;left:0;top:0;right:0;height:4px;
    background:linear-gradient(90deg,#fff,#e91e63,#4054bf);
}
.ss335-meta-grid small{
    display:block;
    color:rgba(255,255,255,.68);
    font-size:10px;
    font-weight:950;
    text-transform:uppercase;
    letter-spacing:.6px;
    margin-bottom:8px;
}
.ss335-meta-grid b{
    display:flex;align-items:center;gap:7px;
    font-size:15px;
    line-height:1.2;
    font-weight:950;
}
.ss335-command{
    display:flex;flex-direction:column;align-items:center;gap:18px;
}
.ss335-orb{
    width:176px;height:176px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.82);
    position:relative;
    box-shadow:0 24px 60px rgba(31,45,128,.24);
}
.ss335-orb:before{
    content:"";position:absolute;inset:-16px;border-radius:50%;
    background:conic-gradient(#38bdf8,#4054bf,#e91e63,#38bdf8);
    z-index:-1;
    animation:ss335Spin 12s linear infinite;
}
.ss335-orb:after{
    content:"";position:absolute;inset:-5px;border-radius:50%;background:rgba(238,241,255,.70);z-index:-1;
}
.ss335-orb div{display:flex;flex-direction:column;align-items:center;text-align:center;color:#4054bf}
.ss335-orb i{font-size:22px;margin-bottom:8px;color:#06b6d4}
.ss335-orb b{font-size:36px;font-weight:950;line-height:1;background:linear-gradient(135deg,#4054bf,#e91e63);-webkit-background-clip:text;background-clip:text;color:transparent}
.ss335-orb span{font-size:10px;font-weight:950;letter-spacing:.6px;text-transform:uppercase;margin-top:5px}
.ss335-action-grid{
    width:100%;
    display:grid;
    gap:10px;
}
.ss335-action{
    min-height:48px;
    border:0;
    border-radius:15px;
    display:flex;align-items:center;justify-content:center;gap:8px;
    padding:12px 16px;
    background:rgba(255,255,255,.22);
    color:#fff!important;
    text-decoration:none!important;
    font-weight:950;
    cursor:pointer;
    border:1px solid rgba(255,255,255,.24);
    transition:.24s ease;
}
.ss335-action.primary{background:linear-gradient(135deg,#e91e63,#7c3aed);box-shadow:0 14px 30px rgba(233,30,99,.22)}
.ss335-action:hover{transform:translateY(-4px)}
.ss335-card{
    background:#fff;
    border:2px solid rgba(64,84,191,.22);
    border-radius:26px;
    box-shadow:0 18px 48px rgba(64,84,191,.09);
    overflow:hidden;
    margin-bottom:20px;
}
.ss335-card-head{
    min-height:66px;
    display:flex;align-items:center;justify-content:space-between;gap:14px;
    padding:18px 22px;
    background:linear-gradient(180deg,#fff,#f4f6ff);
    border-bottom:1px solid rgba(64,84,191,.13);
    color:#14205c;
}
.ss335-card-head h2{
    margin:0;
    display:flex;align-items:center;gap:8px;
    font-size:17px;
    text-transform:uppercase;
    font-weight:950;
}
.ss335-tools{display:flex;flex-wrap:wrap;gap:7px}
.ss335-tools button,.ss335-pill{
    min-height:30px;
    border:1px solid rgba(64,84,191,.20);
    background:#fff;
    color:#4054bf;
    border-radius:999px;
    padding:6px 11px;
    font-size:11px;
    font-weight:950;
    cursor:pointer;
}
.ss335-tools button.active,.ss335-tools button:hover{
    background:linear-gradient(135deg,#4054bf,#6b5ce7);
    color:#fff;
}
.ss335-article{
    padding:42px 48px;
    color:#26325f;
    font-size:18px;
    line-height:1.95;
}
.ss335-article h1,.ss335-article h2,.ss335-article h3{
    color:#14205c;
    font-weight:950;
    line-height:1.18;
}
.ss335-article h2{font-size:34px;margin-top:0}
.ss335-article p{margin-bottom:22px}
.ss335-share{
    display:flex;flex-wrap:wrap;gap:10px;
    padding:20px 48px 30px;
    border-top:1px solid rgba(64,84,191,.12);
}
.ss335-share span,.ss335-share a,.ss335-share button{
    min-height:38px;
    border-radius:999px;
    padding:8px 14px;
    display:inline-flex;align-items:center;gap:7px;
    border:0;
    text-decoration:none!important;
    font-weight:950;
    font-size:12px;
    cursor:pointer;
}
.ss335-share span{background:#eef2ff;color:#4054bf}
.ss335-share a,.ss335-share button{background:#f6f7ff;color:#4054bf}
.ss335-share .fb{background:#1877f2;color:#fff!important}
.ss335-share .tw{background:#111827;color:#fff!important}
.ss335-share .wa{background:#25d366;color:#06200f!important}
.ss335-share a:hover,.ss335-share button:hover{transform:translateY(-3px)}
.ss335-related{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:14px;
    padding:20px 22px 24px;
}
.ss335-rel{
    display:flex;gap:13px;
    min-height:112px;
    background:#f7f9ff;
    border:1px solid rgba(64,84,191,.15);
    border-radius:18px;
    overflow:hidden;
    color:#14205c!important;
    text-decoration:none!important;
    transition:.24s ease;
}
.ss335-rel:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(64,84,191,.12)}
.ss335-rel-img{width:150px;flex:0 0 150px;overflow:hidden}
.ss335-rel-img img{width:100%;height:100%;object-fit:cover}
.ss335-rel-body{padding:14px 12px;display:flex;flex-direction:column;justify-content:center}
.ss335-rel-body b{font-size:14px;line-height:1.35}
.ss335-rel-body small{color:#64709e;font-weight:850;margin-top:8px}
.ss335-comment-form{padding:22px}
.ss335-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ss335-comment-form label{display:block;color:#4054bf;font-size:12px;font-weight:950;text-transform:uppercase;margin-bottom:12px}
.ss335-comment-form input,.ss335-comment-form textarea{
    width:100%;
    margin-top:7px;
    border:1px solid rgba(64,84,191,.18);
    background:#f8faff;
    color:#14205c;
    border-radius:14px;
    padding:13px 15px;
    outline:none;
    text-transform:none;
    font-weight:700;
}
.ss335-comment-form textarea{min-height:150px;resize:vertical}
.ss335-comment-form button{
    width:100%;
    min-height:48px;
    border:0;
    border-radius:14px;
    background:linear-gradient(135deg,#4054bf,#e91e63);
    color:#fff;
    font-weight:950;
}
.ss335-empty{
    margin:0 22px 22px;
    min-height:92px;
    border:1px dashed rgba(64,84,191,.24);
    background:#f7f9ff;
    color:#64709e;
    display:flex;align-items:center;justify-content:center;gap:10px;
    border-radius:18px;
    font-weight:850;
}
.ss335-side{position:sticky;top:18px}
.ss335-side-card{
    background:#fff;
    border:2px solid rgba(64,84,191,.20);
    border-radius:22px;
    box-shadow:0 16px 40px rgba(64,84,191,.08);
    overflow:hidden;
    margin-bottom:16px;
}
.ss335-side-head{
    min-height:60px;
    padding:15px 16px;
    display:flex;align-items:center;gap:10px;
    background:linear-gradient(180deg,#fff,#f4f6ff);
    border-bottom:1px solid rgba(64,84,191,.12);
}
.ss335-side-head span{
    width:38px;height:38px;border-radius:12px;
    background:linear-gradient(135deg,#4054bf,#e91e63);
    color:#fff;display:flex;align-items:center;justify-content:center;
}
.ss335-side-head h4{margin:0;color:#14205c;text-transform:uppercase;font-size:13px;font-weight:950}
.ss335-side-list,.ss335-pop-list{padding:14px}
.ss335-side-list a{
    min-height:44px;
    display:grid;grid-template-columns:28px minmax(0,1fr) 28px;gap:9px;align-items:center;
    padding:8px 10px;
    border-radius:13px;
    background:#f7f9ff;
    color:#14205c!important;
    text-decoration:none!important;
    font-weight:950;
    font-size:13px;
    margin-bottom:8px;
    transition:.22s ease;
}
.ss335-side-list a i{
    width:28px;height:28px;border-radius:10px;background:#e9efff;color:#4054bf;display:flex;align-items:center;justify-content:center;
}
.ss335-side-list a em{
    width:26px;height:26px;border-radius:50%;background:#4054bf;color:#fff;font-style:normal;display:flex;align-items:center;justify-content:center;font-size:12px;
}
.ss335-side-list a:hover{transform:translateY(-3px);box-shadow:0 12px 22px rgba(64,84,191,.10)}
.ss335-pop-list a{
    display:grid;
    grid-template-columns:28px 54px minmax(0,1fr);
    gap:10px;
    align-items:center;
    min-height:62px;
    padding:8px;
    border-radius:14px;
    background:#f7f9ff;
    color:#14205c!important;
    text-decoration:none!important;
    margin-bottom:8px;
    transition:.22s ease;
}
.ss335-pop-list a:hover{transform:translateY(-3px);box-shadow:0 12px 22px rgba(64,84,191,.10)}
.ss335-pop-list .rank{
    width:28px;height:28px;border-radius:10px;background:linear-gradient(135deg,#e91e63,#7c3aed);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:950;
}
.ss335-pop-list .thumb{width:54px;height:44px;border-radius:11px;overflow:hidden;background:#eef2ff}
.ss335-pop-list .thumb img{width:100%;height:100%;object-fit:cover}
.ss335-pop-list .txt{min-width:0}
.ss335-pop-list .txt b{display:block;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ss335-pop-list .txt small{display:block;color:#64709e;font-size:11px;font-weight:850;margin-top:3px}
.ss335-side-empty{
    min-height:92px;display:flex;align-items:center;justify-content:center;color:#64709e;font-weight:800;font-size:13px;padding:16px;
}
.ss335-cta{text-align:center;padding:24px 18px}
.ss335-cta-icon{
    width:58px;height:58px;margin:0 auto 12px;border-radius:19px;
    background:linear-gradient(135deg,#e91e63,#7c3aed);
    color:#fff;display:flex;align-items:center;justify-content:center;font-size:25px;
    box-shadow:0 16px 32px rgba(233,30,99,.18);
}
.ss335-cta h3{color:#14205c;margin:0 0 8px;font-weight:950}
.ss335-cta p{color:#64709e;line-height:1.55;margin:0 0 16px;font-weight:750}
.ss335-cta a{
    min-height:44px;
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:10px 18px;border-radius:999px;
    background:linear-gradient(135deg,#e91e63,#7c3aed);
    color:#fff!important;text-decoration:none!important;font-weight:950;
}
.ss335-focus-mode .ss335-side{display:none}
.ss335-focus-mode .ss335-layout{grid-template-columns:minmax(0,980px);justify-content:center}
.ss335-focus-mode .ss335-hero-grid{grid-template-columns:1fr}
.ss335-focus-mode .ss335-command{display:none}
@media(max-width:1180px){
    .ss335-layout{grid-template-columns:1fr}
    .ss335-side{position:relative;top:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
    .ss335-side-card{margin-bottom:0}
}
@media(max-width:860px){
    .ss335-hero-grid{grid-template-columns:1fr}
    .ss335-command{align-items:flex-start}
    .ss335-action-grid{max-width:360px}
    .ss335-meta-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
    .ss335-related{grid-template-columns:1fr}
    .ss335-form-grid{grid-template-columns:1fr}
    .ss335-side{grid-template-columns:1fr}
    .ss335-crumbs{margin-bottom:60px}
}
@media(max-width:560px){
    .ss335-wrap{width:calc(100% - 20px)}
    .ss335-hero{min-height:auto;padding:20px;border-radius:24px}
    .ss335-hero-text h1{font-size:34px;letter-spacing:-1px}
    .ss335-hero-text p{font-size:15px}
    .ss335-meta-grid{grid-template-columns:1fr}
    .ss335-article{padding:28px 22px;font-size:16px}
    .ss335-share{padding:18px 22px 24px}
    .ss335-card-head{align-items:flex-start;flex-direction:column}
}


/* Makale üst görsel alanı - referans görünüme yakın V3.3.6 */
.ss335-page{
    background:
        linear-gradient(180deg,#eef1ff 0%,#f7f8ff 46%,#eef2ff 100%)!important;
}
.ss335-wrap{
    width:min(1360px,calc(100% - 34px))!important;
}
.ss335-layout{
    grid-template-columns:minmax(0,1fr) 330px!important;
    gap:24px!important;
}
.ss336-hero-like-ref,
.ss335-hero{
    min-height:565px!important;
    border-radius:34px!important;
    padding:32px 34px!important;
    background:
        linear-gradient(90deg,rgba(8,14,30,.72) 0%,rgba(17,24,45,.58) 44%,rgba(8,14,30,.18) 100%),
        var(--ss335-img) center center/cover no-repeat!important;
    border:1px solid rgba(64,84,191,.32)!important;
    box-shadow:0 30px 78px rgba(42,54,145,.20)!important;
}
.ss336-hero-like-ref .ss335-hero-bg,
.ss335-hero .ss335-hero-bg{
    background:
        linear-gradient(180deg,rgba(255,255,255,.04),rgba(8,14,30,.28)),
        radial-gradient(circle at 78% 30%,rgba(255,255,255,.13),transparent 20%),
        linear-gradient(90deg,rgba(8,14,30,.52),rgba(8,14,30,.10))!important;
}
.ss336-hero-like-ref:after,
.ss335-hero:after{
    display:none!important;
}
.ss336-hero-like-ref .ss335-crumbs,
.ss335-hero .ss335-crumbs{
    margin-bottom:145px!important;
}
.ss336-hero-like-ref .ss335-crumbs a,
.ss335-hero .ss335-crumbs a{
    background:rgba(17,24,39,.58)!important;
    border:1px solid rgba(255,255,255,.22)!important;
    color:#fff!important;
    box-shadow:0 10px 24px rgba(0,0,0,.16)!important;
}
.ss336-hero-like-ref .ss335-crumbs a:hover,
.ss335-hero .ss335-crumbs a:hover{
    background:#fff!important;
    color:#4054bf!important;
}
.ss336-hero-like-ref .ss335-hero-grid,
.ss335-hero .ss335-hero-grid{
    grid-template-columns:minmax(0,1fr) 300px!important;
    align-items:end!important;
    gap:32px!important;
}
.ss336-hero-like-ref .ss335-kicker,
.ss335-hero .ss335-kicker{
    background:rgba(233,30,99,.78)!important;
    border:1px solid rgba(255,255,255,.16)!important;
    backdrop-filter:blur(10px)!important;
    box-shadow:0 16px 34px rgba(233,30,99,.22)!important;
}
.ss336-hero-like-ref .ss335-hero-text h1,
.ss335-hero .ss335-hero-text h1{
    max-width:760px!important;
    font-size:clamp(44px,5vw,72px)!important;
    line-height:1.02!important;
    letter-spacing:-2px!important;
    text-transform:none!important;
    text-shadow:0 16px 34px rgba(0,0,0,.30)!important;
}
.ss336-hero-like-ref .ss335-hero-text h1:after,
.ss335-hero .ss335-hero-text h1:after{
    width:330px!important;
    height:6px!important;
    background:linear-gradient(90deg,#fff,#e91e63,#4054bf)!important;
    box-shadow:none!important;
}
.ss336-hero-like-ref .ss335-hero-text p,
.ss335-hero .ss335-hero-text p{
    max-width:700px!important;
    color:rgba(255,255,255,.88)!important;
    font-size:17px!important;
    line-height:1.65!important;
    font-weight:700!important;
}
.ss336-hero-like-ref .ss335-meta-grid,
.ss335-hero .ss335-meta-grid{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:12px!important;
}
.ss336-hero-like-ref .ss335-meta-grid div,
.ss335-hero .ss335-meta-grid div{
    min-height:76px!important;
    border-radius:17px!important;
    background:rgba(20,25,42,.70)!important;
    border:1px solid rgba(255,255,255,.15)!important;
    box-shadow:0 14px 34px rgba(0,0,0,.16)!important;
    backdrop-filter:blur(10px)!important;
}
.ss336-hero-like-ref .ss335-meta-grid div:before,
.ss335-hero .ss335-meta-grid div:before{
    background:linear-gradient(90deg,#33d6ff,#e91e63,#7c3aed)!important;
}
.ss336-hero-like-ref .ss335-meta-grid small,
.ss335-hero .ss335-meta-grid small{
    color:rgba(255,255,255,.62)!important;
}
.ss336-hero-like-ref .ss335-meta-grid b,
.ss335-hero .ss335-meta-grid b{
    color:#fff!important;
}
.ss336-hero-like-ref .ss335-command,
.ss335-hero .ss335-command{
    align-items:stretch!important;
    justify-content:flex-end!important;
}
.ss336-hero-like-ref .ss335-orb,
.ss335-hero .ss335-orb{
    width:195px!important;
    height:195px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    background:#071225!important;
    color:#fff!important;
    box-shadow:0 24px 64px rgba(0,0,0,.30)!important;
    transform:rotate(-18deg)!important;
}
.ss336-hero-like-ref .ss335-orb:before,
.ss335-hero .ss335-orb:before{
    inset:-13px!important;
    background:conic-gradient(#27d5ff,#4054bf,#e91e63,#a855f7,#27d5ff)!important;
}
.ss336-hero-like-ref .ss335-orb:after,
.ss335-hero .ss335-orb:after{
    inset:8px!important;
    background:#071225!important;
}
.ss336-hero-like-ref .ss335-orb div,
.ss335-hero .ss335-orb div{
    color:#fff!important;
}
.ss336-hero-like-ref .ss335-orb i,
.ss335-hero .ss335-orb i{
    width:48px!important;
    height:48px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 auto 10px!important;
    background:#20e7f1!important;
    color:#06202a!important;
    font-size:22px!important;
}
.ss336-hero-like-ref .ss335-orb b,
.ss335-hero .ss335-orb b{
    color:#fff!important;
    background:none!important;
    -webkit-background-clip:initial!important;
    background-clip:initial!important;
    font-size:44px!important;
    letter-spacing:-1px!important;
    line-height:.9!important;
}
.ss336-hero-like-ref .ss335-orb span,
.ss335-hero .ss335-orb span{
    color:rgba(255,255,255,.72)!important;
    font-size:11px!important;
}
.ss336-hero-like-ref .ss335-action-grid,
.ss335-hero .ss335-action-grid{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:12px!important;
    margin-top:8px!important;
}
.ss336-hero-like-ref .ss335-action,
.ss335-hero .ss335-action{
    min-height:54px!important;
    border-radius:17px!important;
    background:rgba(255,255,255,.20)!important;
    border:1px solid rgba(255,255,255,.22)!important;
    color:#fff!important;
    backdrop-filter:blur(10px)!important;
}
.ss336-hero-like-ref .ss335-action.primary,
.ss335-hero .ss335-action.primary{
    background:linear-gradient(135deg,#e91e63,#a855f7)!important;
    border:0!important;
    box-shadow:0 16px 36px rgba(233,30,99,.28)!important;
}
@media(max-width:1180px){
    .ss335-layout{grid-template-columns:1fr!important}
}
@media(max-width:900px){
    .ss336-hero-like-ref .ss335-hero-grid,
    .ss335-hero .ss335-hero-grid{
        grid-template-columns:1fr!important;
    }
    .ss336-hero-like-ref .ss335-crumbs,
    .ss335-hero .ss335-crumbs{
        margin-bottom:72px!important;
    }
    .ss336-hero-like-ref .ss335-command,
    .ss335-hero .ss335-command{
        align-items:flex-start!important;
    }
    .ss336-hero-like-ref .ss335-orb,
    .ss335-hero .ss335-orb{
        margin-left:0!important;
    }
    .ss336-hero-like-ref .ss335-action-grid,
    .ss335-hero .ss335-action-grid{
        max-width:420px!important;
    }
}
@media(max-width:620px){
    .ss336-hero-like-ref,
    .ss335-hero{
        min-height:auto!important;
        padding:22px!important;
        border-radius:24px!important;
    }
    .ss336-hero-like-ref .ss335-hero-text h1,
    .ss335-hero .ss335-hero-text h1{
        font-size:34px!important;
        letter-spacing:-1px!important;
    }
    .ss336-hero-like-ref .ss335-meta-grid,
    .ss335-hero .ss335-meta-grid{
        grid-template-columns:1fr!important;
    }
    .ss336-hero-like-ref .ss335-action-grid,
    .ss335-hero .ss335-action-grid{
        grid-template-columns:1fr!important;
    }
}

/* ==================================================
   Okunma Sinyali V4 - Orijinal ec-orb hareketi
   Daire komple döner; ikon, sayı ve yazı da daireyle birlikte döner.
================================================== */
body .ss335-hero .ss335-command,
body .ss336-hero-like-ref .ss335-command{
    align-self:end !important;
    display:grid !important;
    gap:14px !important;
    justify-items:center !important;
    align-items:end !important;
    overflow:visible !important;
    min-width:230px !important;
}

body .ss335-hero .ec-orb,
body .ss336-hero-like-ref .ec-orb,
body .ss335-hero .ec-orb.ss335-orb,
body .ss336-hero-like-ref .ec-orb.ss335-orb{
    position:relative !important;
    width:230px !important;
    height:230px !important;
    min-width:230px !important;
    min-height:230px !important;
    margin:0 auto 8px !important;
    border-radius:50% !important;
    display:grid !important;
    place-items:center !important;
    background:conic-gradient(from 0deg,#e91e63,#8b5cff,#4268ff,#20d9ff,#e91e63) !important;
    border:0 !important;
    outline:0 !important;
    box-shadow:0 0 70px rgba(25,241,255,.24),0 18px 45px rgba(64,84,191,.22) !important;
    overflow:visible !important;
    isolation:isolate !important;
    transform-origin:50% 50% !important;
    animation-name:sohbetOrbSpin !important;
    animation-duration:12s !important;
    animation-timing-function:linear !important;
    animation-iteration-count:infinite !important;
    animation-play-state:running !important;
    will-change:transform !important;
}

body .ss335-hero .ec-orb::before,
body .ss336-hero-like-ref .ec-orb::before,
body .ss335-hero .ec-orb.ss335-orb::before,
body .ss336-hero-like-ref .ec-orb.ss335-orb::before{
    content:"" !important;
    position:absolute !important;
    inset:10px !important;
    border-radius:50% !important;
    background:#071126 !important;
    border:1px solid rgba(255,255,255,.12) !important;
    z-index:1 !important;
    box-shadow:none !important;
}

body .ss335-hero .ec-orb::after,
body .ss336-hero-like-ref .ec-orb::after,
body .ss335-hero .ec-orb.ss335-orb::after,
body .ss336-hero-like-ref .ec-orb.ss335-orb::after{
    display:none !important;
    content:none !important;
}

body .ss335-hero .ec-orb .ec-orb-in,
body .ss336-hero-like-ref .ec-orb .ec-orb-in,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in{
    position:relative !important;
    z-index:2 !important;
    width:auto !important;
    height:auto !important;
    display:block !important;
    text-align:center !important;
    color:#fff !important;
    transform:none !important;
    transform-origin:center center !important;
}

body .ss335-hero .ec-orb .ec-orb-in i,
body .ss336-hero-like-ref .ec-orb .ec-orb-in i,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in i,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in i{
    width:auto !important;
    height:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    display:block !important;
    background:transparent !important;
    border-radius:0 !important;
    color:#20d9ff !important;
    font-size:42px !important;
    line-height:1 !important;
    filter:drop-shadow(0 0 16px #20d9ff) !important;
    box-shadow:none !important;
}

body .ss335-hero .ec-orb .ec-orb-in b,
body .ss336-hero-like-ref .ec-orb .ec-orb-in b,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in b,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in b{
    display:block !important;
    margin:10px 0 0 !important;
    padding:0 !important;
    font-size:42px !important;
    line-height:1 !important;
    font-weight:950 !important;
    letter-spacing:-1.8px !important;
    color:#fff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#fff !important;
}

body .ss335-hero .ec-orb .ec-orb-in span,
body .ss336-hero-like-ref .ec-orb .ec-orb-in span,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in span,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in span{
    display:block !important;
    margin-top:7px !important;
    color:rgba(210,224,255,.82) !important;
    font-size:12px !important;
    line-height:1.05 !important;
    font-weight:900 !important;
    letter-spacing:.6px !important;
    text-transform:uppercase !important;
    white-space:nowrap !important;
}

@keyframes sohbetOrbSpin{
    0%{transform:rotate(0deg) !important;}
    100%{transform:rotate(360deg) !important;}
}

/* Yazar kutusu - uzun kullanıcı adı kesilmesin */
body .ss335-hero .ss335-meta-grid,
body .ss336-hero-like-ref .ss335-meta-grid{
    grid-template-columns:minmax(270px,1.8fr) minmax(120px,.75fr) minmax(110px,.65fr) minmax(150px,.95fr) !important;
    gap:12px !important;
    align-items:stretch !important;
}

body .ss335-hero .ss335-meta-grid div,
body .ss336-hero-like-ref .ss335-meta-grid div{
    min-height:78px !important;
    padding:13px 14px !important;
    min-width:0 !important;
    overflow:visible !important;
}

body .ss335-hero .ss335-meta-grid b,
body .ss336-hero-like-ref .ss335-meta-grid b{
    display:flex !important;
    align-items:center !important;
    gap:7px !important;
    max-width:none !important;
    min-width:0 !important;
    overflow:visible !important;
    text-overflow:clip !important;
    line-height:1.16 !important;
}

body .ss335-hero .ss335-meta-grid div:first-child b,
body .ss336-hero-like-ref .ss335-meta-grid div:first-child b{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    font-size:13px !important;
    letter-spacing:-.25px !important;
}

body .ss335-hero .ss335-meta-grid b i,
body .ss336-hero-like-ref .ss335-meta-grid b i{
    flex:0 0 auto !important;
}

@media(max-width:991px){
    body .ss335-hero .ss335-command,
    body .ss336-hero-like-ref .ss335-command{
        justify-items:start !important;
        min-width:0 !important;
    }

    body .ss335-hero .ec-orb,
    body .ss336-hero-like-ref .ec-orb,
    body .ss335-hero .ec-orb.ss335-orb,
    body .ss336-hero-like-ref .ec-orb.ss335-orb{
        width:180px !important;
        height:180px !important;
        min-width:180px !important;
        min-height:180px !important;
        margin-left:0 !important;
    }

    body .ss335-hero .ec-orb::before,
    body .ss336-hero-like-ref .ec-orb::before{
        inset:8px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in i,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in i{
        font-size:34px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in b,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in b{
        font-size:34px !important;
    }

    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:576px){
    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:1fr !important;
    }
}


/* ==================================================
   Okunma Sinyali V5 - JS destekli kesin dönüş
   Daire, ikon, sayı ve yazı birlikte döner.
================================================== */
body .ss335-hero .ec-orb,
body .ss336-hero-like-ref .ec-orb,
body .ss335-hero .ec-orb.ss335-orb,
body .ss336-hero-like-ref .ec-orb.ss335-orb{
    position:relative !important;
    width:210px !important;
    height:210px !important;
    min-width:210px !important;
    min-height:210px !important;
    margin:0 auto 10px !important;
    border-radius:50% !important;
    display:grid !important;
    place-items:center !important;
    background:conic-gradient(from 0deg,#20d9ff,#4268ff,#8b5cff,#e91e63,#20d9ff) !important;
    border:0 !important;
    outline:0 !important;
    overflow:visible !important;
    isolation:isolate !important;
    box-shadow:0 18px 46px rgba(64,84,191,.22),0 0 38px rgba(32,217,255,.16) !important;
    will-change:transform !important;
    animation:none !important;
}

body .ss335-hero .ec-orb::before,
body .ss336-hero-like-ref .ec-orb::before,
body .ss335-hero .ec-orb.ss335-orb::before,
body .ss336-hero-like-ref .ec-orb.ss335-orb::before{
    content:"" !important;
    position:absolute !important;
    inset:13px !important;
    border-radius:50% !important;
    background:radial-gradient(circle at 30% 22%,#102349 0%,#071126 54%,#050b18 100%) !important;
    z-index:1 !important;
    border:1px solid rgba(255,255,255,.08) !important;
}

body .ss335-hero .ec-orb::after,
body .ss336-hero-like-ref .ec-orb::after,
body .ss335-hero .ec-orb.ss335-orb::after,
body .ss336-hero-like-ref .ec-orb.ss335-orb::after{
    content:none !important;
    display:none !important;
}

body .ss335-hero .ec-orb .ec-orb-in,
body .ss336-hero-like-ref .ec-orb .ec-orb-in,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in{
    position:relative !important;
    z-index:2 !important;
    width:138px !important;
    height:138px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    color:#fff !important;
    transform:none !important;
}

body .ss335-hero .ec-orb .ec-orb-in i,
body .ss336-hero-like-ref .ec-orb .ec-orb-in i,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in i,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in i{
    width:48px !important;
    height:48px !important;
    margin:0 0 8px !important;
    border-radius:20px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:#20d9ff !important;
    color:#071126 !important;
    font-size:20px !important;
    line-height:1 !important;
    filter:drop-shadow(0 0 18px rgba(32,217,255,.65)) !important;
    box-shadow:none !important;
}

body .ss335-hero .ec-orb .ec-orb-in b,
body .ss336-hero-like-ref .ec-orb .ec-orb-in b,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in b,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in b{
    display:block !important;
    margin:0 !important;
    padding:0 !important;
    font-size:42px !important;
    line-height:.9 !important;
    font-weight:950 !important;
    letter-spacing:-2px !important;
    color:#fff !important;
    background:none !important;
    -webkit-background-clip:initial !important;
    background-clip:initial !important;
    -webkit-text-fill-color:#fff !important;
}

body .ss335-hero .ec-orb .ec-orb-in span,
body .ss336-hero-like-ref .ec-orb .ec-orb-in span,
body .ss335-hero .ec-orb.ss335-orb .ec-orb-in span,
body .ss336-hero-like-ref .ec-orb.ss335-orb .ec-orb-in span{
    display:block !important;
    margin-top:8px !important;
    font-size:12px !important;
    line-height:1.05 !important;
    font-weight:950 !important;
    letter-spacing:.7px !important;
    text-transform:uppercase !important;
    color:rgba(255,255,255,.78) !important;
    white-space:nowrap !important;
}

body .ss335-hero .ss335-meta-grid,
body .ss336-hero-like-ref .ss335-meta-grid{
    grid-template-columns:minmax(300px,2fr) minmax(130px,.8fr) minmax(115px,.7fr) minmax(160px,1fr) !important;
    gap:12px !important;
}

body .ss335-hero .ss335-meta-grid div,
body .ss336-hero-like-ref .ss335-meta-grid div{
    min-height:78px !important;
    overflow:visible !important;
}

body .ss335-hero .ss335-meta-grid div:first-child b,
body .ss336-hero-like-ref .ss335-meta-grid div:first-child b{
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    font-size:13px !important;
    line-height:1.16 !important;
}

@media(max-width:991px){
    body .ss335-hero .ec-orb,
    body .ss336-hero-like-ref .ec-orb,
    body .ss335-hero .ec-orb.ss335-orb,
    body .ss336-hero-like-ref .ec-orb.ss335-orb{
        width:165px !important;
        height:165px !important;
        min-width:165px !important;
        min-height:165px !important;
        margin-left:0 !important;
    }

    body .ss335-hero .ec-orb::before,
    body .ss336-hero-like-ref .ec-orb::before{
        inset:10px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in{
        width:112px !important;
        height:112px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in i,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in i{
        width:40px !important;
        height:40px !important;
        font-size:17px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in b,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in b{
        font-size:34px !important;
    }

    body .ss335-hero .ec-orb .ec-orb-in span,
    body .ss336-hero-like-ref .ec-orb .ec-orb-in span{
        font-size:10px !important;
    }

    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

/* ==================================================
   Makale Hero Alt Alan Hizalama V6
   Meta kutuları ve aksiyon butonlarında taşma/kayma düzeltmesi
================================================== */
body .ss335-hero .ss335-hero-grid,
body .ss336-hero-like-ref .ss335-hero-grid{
    grid-template-columns:minmax(0,1fr) 270px !important;
    gap:26px !important;
    align-items:end !important;
}

body .ss335-hero .ss335-hero-text,
body .ss336-hero-like-ref .ss335-hero-text{
    min-width:0 !important;
    max-width:100% !important;
}

body .ss335-hero .ss335-meta-grid,
body .ss336-hero-like-ref .ss335-meta-grid{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:grid !important;
    grid-template-columns:minmax(190px,1.35fr) minmax(112px,.72fr) minmax(96px,.58fr) minmax(128px,.78fr) !important;
    gap:12px !important;
    align-items:stretch !important;
    overflow:visible !important;
}

body .ss335-hero .ss335-meta-grid div,
body .ss336-hero-like-ref .ss335-meta-grid div{
    min-width:0 !important;
    width:auto !important;
    max-width:100% !important;
    min-height:74px !important;
    padding:15px 14px !important;
    overflow:hidden !important;
}

body .ss335-hero .ss335-meta-grid small,
body .ss336-hero-like-ref .ss335-meta-grid small{
    display:block !important;
    margin-bottom:7px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

body .ss335-hero .ss335-meta-grid b,
body .ss336-hero-like-ref .ss335-meta-grid b{
    min-width:0 !important;
    max-width:100% !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:normal !important;
    line-height:1.15 !important;
    font-size:14px !important;
}

body .ss335-hero .ss335-meta-grid b i,
body .ss336-hero-like-ref .ss335-meta-grid b i{
    flex:0 0 auto !important;
}

body .ss335-hero .ss335-meta-grid div:first-child,
body .ss336-hero-like-ref .ss335-meta-grid div:first-child{
    padding-right:16px !important;
}

body .ss335-hero .ss335-meta-grid div:first-child b,
body .ss336-hero-like-ref .ss335-meta-grid div:first-child b{
    font-size:13px !important;
    line-height:1.15 !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
}

body .ss335-hero .ss335-command,
body .ss336-hero-like-ref .ss335-command{
    min-width:0 !important;
    width:270px !important;
    max-width:270px !important;
    align-self:end !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:12px !important;
}

body .ss335-hero .ss335-action-grid,
body .ss336-hero-like-ref .ss335-action-grid{
    width:100% !important;
    max-width:270px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    margin-top:0 !important;
}

body .ss335-hero .ss335-action,
body .ss336-hero-like-ref .ss335-action{
    min-width:0 !important;
    width:100% !important;
    min-height:64px !important;
    padding:12px 12px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    gap:8px !important;
    line-height:1.12 !important;
    font-size:16px !important;
}

@media(max-width:1180px){
    body .ss335-hero .ss335-hero-grid,
    body .ss336-hero-like-ref .ss335-hero-grid{
        grid-template-columns:minmax(0,1fr) 240px !important;
        gap:20px !important;
    }

    body .ss335-hero .ss335-command,
    body .ss336-hero-like-ref .ss335-command{
        width:240px !important;
        max-width:240px !important;
    }

    body .ss335-hero .ss335-action-grid,
    body .ss336-hero-like-ref .ss335-action-grid{
        max-width:240px !important;
    }

    body .ss335-hero .ss335-action,
    body .ss336-hero-like-ref .ss335-action{
        min-height:58px !important;
        font-size:14px !important;
        padding:10px 8px !important;
    }

    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:minmax(170px,1.25fr) minmax(104px,.7fr) minmax(86px,.55fr) minmax(116px,.75fr) !important;
        gap:10px !important;
    }
}

@media(max-width:991px){
    body .ss335-hero .ss335-hero-grid,
    body .ss336-hero-like-ref .ss335-hero-grid{
        grid-template-columns:1fr !important;
    }

    body .ss335-hero .ss335-command,
    body .ss336-hero-like-ref .ss335-command{
        width:100% !important;
        max-width:100% !important;
        align-items:flex-start !important;
    }

    body .ss335-hero .ss335-action-grid,
    body .ss336-hero-like-ref .ss335-action-grid{
        max-width:360px !important;
    }

    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    }
}

@media(max-width:560px){
    body .ss335-hero .ss335-meta-grid,
    body .ss336-hero-like-ref .ss335-meta-grid{
        grid-template-columns:1fr !important;
    }

    body .ss335-hero .ss335-action-grid,
    body .ss336-hero-like-ref .ss335-action-grid{
        grid-template-columns:1fr !important;
        max-width:100% !important;
    }
}


/* ==================================================
   Sade üst hızlı geçiş alanı - daireli hero yerine
   Temiz CTA kart görünümü
================================================== */
.ss327-header .sade-quick-actions{
    position:relative!important;
    z-index:2!important;
    margin:26px 0 0!important;
    padding:28px 0 34px!important;
    background:
        radial-gradient(circle at 18% 0%,rgba(145,76,255,.22),transparent 32%),
        radial-gradient(circle at 86% 14%,rgba(24,170,255,.14),transparent 30%),
        linear-gradient(180deg,#11133a 0%,#071327 100%)!important;
    border-top:1px solid rgba(64,84,191,.22)!important;
    border-bottom:1px solid rgba(25,225,255,.16)!important;
    overflow:hidden!important;
}

.ss327-header .sade-quick-actions::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background-image:
        linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),
        linear-gradient(180deg,rgba(255,255,255,.020) 1px,transparent 1px)!important;
    background-size:42px 42px!important;
    opacity:.35!important;
    pointer-events:none!important;
}

.ss327-header .sade-quick-actions .container{
    position:relative!important;
    z-index:2!important;
    max-width:1340px!important;
}

.sade-quick-actions-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:24px!important;
    align-items:stretch!important;
}

.sade-action-card{
    min-height:112px!important;
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    gap:22px!important;
    padding:24px 28px!important;
    border-radius:24px!important;
    text-decoration:none!important;
    overflow:hidden!important;
    isolation:isolate!important;
    background:
        radial-gradient(circle at 10% 0%,rgba(145,76,255,.18),transparent 42%),
        linear-gradient(180deg,rgba(12,29,59,.94),rgba(6,16,33,.96))!important;
    border:1px solid rgba(93,151,255,.30)!important;
    box-shadow:0 24px 58px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.07)!important;
    color:#fff!important;
    transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease!important;
}

.sade-action-card::before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    z-index:-1!important;
    background:radial-gradient(circle at 15% 40%,rgba(25,225,255,.10),transparent 46%)!important;
    opacity:.75!important;
    pointer-events:none!important;
}

.sade-action-card::after{
    content:""!important;
    position:absolute!important;
    left:28px!important;
    right:28px!important;
    bottom:18px!important;
    height:3px!important;
    border-radius:999px!important;
    transform:scaleX(.30)!important;
    transform-origin:left center!important;
    transition:transform .32s cubic-bezier(.23,1,.32,1)!important;
    opacity:.9!important;
}

.sade-action-card:hover{
    transform:translateY(-5px)!important;
    border-color:rgba(25,225,255,.46)!important;
    box-shadow:0 30px 70px rgba(0,0,0,.34),0 0 30px rgba(145,76,255,.15)!important;
}

.sade-action-card:hover::after{
    transform:scaleX(1)!important;
}

.sade-action-icon{
    width:66px!important;
    height:66px!important;
    flex:0 0 66px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:20px!important;
    color:#fff!important;
    font-size:25px!important;
    box-shadow:0 0 28px rgba(145,76,255,.25)!important;
}

.sade-action-body{
    min-width:0!important;
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    gap:7px!important;
}

.sade-action-body strong{
    display:block!important;
    margin:0!important;
    color:#fff!important;
    font-size:22px!important;
    line-height:1.06!important;
    font-weight:950!important;
    text-transform:uppercase!important;
    letter-spacing:.2px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

.sade-action-body small{
    display:block!important;
    color:#9db0d4!important;
    font-size:14px!important;
    line-height:1.25!important;
    font-weight:700!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

.sade-action-arrow{
    width:38px!important;
    height:38px!important;
    flex:0 0 38px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#fff!important;
    font-size:20px!important;
    opacity:.82!important;
    transition:transform .28s ease,opacity .28s ease!important;
}

.sade-action-card:hover .sade-action-arrow{
    transform:translateX(6px)!important;
    opacity:1!important;
}

.sade-action-chat{
    border-color:rgba(24,170,255,.32)!important;
}

.sade-action-chat::after{
    background:linear-gradient(90deg,#18aaff,#914cff,#ff3d9a)!important;
}

.sade-action-chat .sade-action-icon{
    background:linear-gradient(135deg,#7c3aed,#18aaff)!important;
}

.sade-action-register{
    border-color:rgba(25,225,255,.34)!important;
}

.sade-action-register::before{
    background:radial-gradient(circle at 15% 40%,rgba(255,61,154,.12),transparent 46%)!important;
}

.sade-action-register::after{
    background:linear-gradient(90deg,#ffbd32,#ff3d9a,#19e1ff)!important;
}

.sade-action-register .sade-action-icon{
    background:linear-gradient(135deg,#ff3d71,#ff8b35)!important;
}

@media(max-width:992px){
    .ss327-header .sade-quick-actions{
        margin-top:22px!important;
        padding:24px 0 28px!important;
    }

    .sade-quick-actions-grid{
        grid-template-columns:1fr!important;
        gap:16px!important;
    }

    .sade-action-card{
        min-height:98px!important;
    }
}

@media(max-width:560px){
    .ss327-header .sade-quick-actions{
        padding:18px 0 22px!important;
    }

    .sade-action-card{
        min-height:88px!important;
        padding:18px 18px!important;
        gap:15px!important;
        border-radius:20px!important;
    }

    .sade-action-card::after{
        left:18px!important;
        right:18px!important;
        bottom:13px!important;
    }

    .sade-action-icon{
        width:54px!important;
        height:54px!important;
        flex-basis:54px!important;
        border-radius:17px!important;
        font-size:21px!important;
    }

    .sade-action-body strong{
        font-size:17px!important;
    }

    .sade-action-body small{
        font-size:12px!important;
        white-space:normal!important;
    }

    .sade-action-arrow{
        width:28px!important;
        height:28px!important;
        flex-basis:28px!important;
        font-size:17px!important;
    }
}

/* ==================================================
   Üst CTA sonrası boşluk düzeltme
   Eski Sade tema .header min-height arka planını kapatır
   ve alt içeriği yukarı alır.
================================================== */
body.ss327-sade .ss327-header.header{
    min-height:auto !important;
    height:auto !important;
    padding-bottom:0 !important;
    margin-bottom:0 !important;
    background:transparent !important;
    border-bottom:0 !important;
    overflow:visible !important;
}

body.ss327-sade .ss327-header .container.pt-5{
    padding-top:24px !important;
}

body.ss327-sade .ss327-header .sade-quick-actions{
    margin:18px 0 0 !important;
    padding:26px 0 !important;
    border-bottom:0 !important;
}

body.ss327-sade .ss327-header + .ss327-page-wrap,
body.ss327-sade .ss327-header + .ss335-page,
body.ss327-sade .ss327-header + main,
body.ss327-sade .ss327-header + section{
    margin-top:0 !important;
    padding-top:28px !important;
}

body.ss327-sade .ss327-page-wrap{
    padding-top:32px !important;
}

/* Eski daireli hero görselinden kalan dekorlar görünmesin */
body.ss327-sade .ss327-header .ss327-hero-wrap,
body.ss327-sade .ss327-header .sols,
body.ss327-sade .ss327-header .sags,
body.ss327-sade .ss327-header .circle-blue-large,
body.ss327-sade .ss327-header .circle-orange-small,
body.ss327-sade .ss327-header .circle-pink-medium,
body.ss327-sade .ss327-header .circle-red-large,
body.ss327-sade .ss327-header .circle-blue-large-right,
body.ss327-sade .ss327-header .circle-orange-small-right,
body.ss327-sade .ss327-header .circle-pink-medium-right,
body.ss327-sade .ss327-header .circle-red-large-right{
    display:none !important;
}

/* CTA alanını daha derli toplu ve fazla uzun olmayan bir banda çeker */
body.ss327-sade .sade-quick-actions-grid{
    max-width:1120px !important;
    margin:0 auto !important;
}

body.ss327-sade .sade-action-card{
    min-height:96px !important;
    padding:20px 26px !important;
}

body.ss327-sade .sade-action-icon{
    width:58px !important;
    height:58px !important;
    flex-basis:58px !important;
    border-radius:18px !important;
    font-size:22px !important;
}

body.ss327-sade .sade-action-body strong{
    font-size:20px !important;
}

body.ss327-sade .sade-action-body small{
    font-size:13px !important;
}

@media(max-width:991px){
    body.ss327-sade .ss327-header .container.pt-5{
        padding-top:16px !important;
    }

    body.ss327-sade .ss327-header .sade-quick-actions{
        margin-top:14px !important;
        padding:20px 0 !important;
    }

    body.ss327-sade .sade-quick-actions-grid{
        grid-template-columns:1fr !important;
        gap:14px !important;
    }

    body.ss327-sade .sade-action-card{
        min-height:86px !important;
    }
}


/* ==================================================
   Canlı kullanıcı haritası - hafif AJAX modül
   Ana sayfayı bloklamaz; içerik sonradan yüklenir.
================================================== */
.sade-live-map-lite{
    position:relative!important;
    z-index:1!important;
    padding:22px 0 34px!important;
    background:linear-gradient(180deg,#071327 0%,#061021 100%)!important;
}

.sade-live-map-lite .container{
    max-width:1340px!important;
}

.sade-live-map-shell{
    min-height:120px!important;
    border-radius:28px!important;
    border:1px solid rgba(93,151,255,.30)!important;
    background:
        radial-gradient(circle at 18% 0%,rgba(145,76,255,.22),transparent 34%),
        radial-gradient(circle at 88% 10%,rgba(25,225,255,.14),transparent 32%),
        linear-gradient(180deg,rgba(12,29,59,.94),rgba(6,16,33,.97))!important;
    box-shadow:0 28px 80px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.08)!important;
    overflow:hidden!important;
    position:relative!important;
}

.sade-live-map-shell:before{
    content:""!important;
    position:absolute!important;
    inset:0!important;
    background-image:radial-gradient(circle,rgba(255,255,255,.075) 1px,transparent 1.8px)!important;
    background-size:22px 22px!important;
    opacity:.12!important;
    pointer-events:none!important;
}

.sade-live-map-shell:after{
    content:""!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:0!important;
    height:3px!important;
    background:linear-gradient(90deg,#18aaff,#914cff,#ff3d9a,#19e1ff)!important;
    box-shadow:0 0 28px rgba(25,225,255,.30)!important;
    pointer-events:none!important;
}

.sade-live-map-loading{
    min-height:120px!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    text-align:center!important;
    color:#dfeaff!important;
    position:relative!important;
    z-index:2!important;
}

.sade-live-map-loading span{
    width:34px!important;
    height:34px!important;
    border-radius:50%!important;
    border:3px solid rgba(255,255,255,.16)!important;
    border-top-color:#19e1ff!important;
    animation:sadeMapLoader .8s linear infinite!important;
}

.sade-live-map-loading b{font-size:14px!important;text-transform:uppercase!important;letter-spacing:.8px!important}
.sade-live-map-loading small{font-size:12px!important;color:#93a7c7!important}

@keyframes sadeMapLoader{to{transform:rotate(360deg)}}

.sade-live-map-inner{
    position:relative!important;
    z-index:2!important;
    min-height:440px!important;
    padding:28px 28px 26px!important;
}

.sade-live-map-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:16px!important;
    margin-bottom:20px!important;
}

.sade-live-map-title{
    display:flex!important;
    align-items:center!important;
    gap:14px!important;
    min-width:0!important;
}

.sade-live-map-title i{
    width:52px!important;
    height:52px!important;
    border-radius:16px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:linear-gradient(135deg,#914cff,#18aaff)!important;
    color:#fff!important;
    box-shadow:0 0 28px rgba(145,76,255,.36)!important;
    flex:0 0 52px!important;
}

.sade-live-map-title strong{
    display:block!important;
    color:#fff!important;
    font-size:22px!important;
    line-height:1.05!important;
    font-weight:950!important;
    text-transform:uppercase!important;
}

.sade-live-map-title span{
    display:block!important;
    margin-top:5px!important;
    color:#93a7c7!important;
    font-size:13px!important;
    font-weight:700!important;
}

.sade-live-map-count{
    display:inline-flex!important;
    align-items:center!important;
    gap:8px!important;
    min-height:38px!important;
    padding:0 15px!important;
    border-radius:999px!important;
    border:1px solid rgba(93,151,255,.28)!important;
    background:rgba(255,255,255,.06)!important;
    color:#eaf2ff!important;
    font-size:13px!important;
    font-weight:900!important;
    white-space:nowrap!important;
}

.sade-live-map-count:before{
    content:""!important;
    width:10px!important;
    height:10px!important;
    border-radius:50%!important;
    background:#2ce278!important;
    box-shadow:0 0 14px #2ce278!important;
}

.sade-live-map-area{
    position:relative!important;
    min-height:340px!important;
    border-radius:22px!important;
    border:1px solid rgba(93,151,255,.18)!important;
    background:
        radial-gradient(circle at 48% 43%,rgba(255,61,154,.15),transparent 16%),
        radial-gradient(circle at 70% 55%,rgba(145,76,255,.18),transparent 15%),
        radial-gradient(circle at 25% 45%,rgba(255,189,50,.08),transparent 18%),
        rgba(3,13,31,.42)!important;
    overflow:hidden!important;
}

.sade-live-map-line{
    position:absolute!important;
    inset:0!important;
    pointer-events:none!important;
    opacity:.68!important;
    background:
        radial-gradient(ellipse at 35% 45%,transparent 36%,rgba(25,225,255,.30) 36.4%,transparent 37%),
        radial-gradient(ellipse at 68% 52%,transparent 34%,rgba(145,76,255,.32) 34.3%,transparent 35%),
        radial-gradient(ellipse at 50% 66%,transparent 40%,rgba(255,61,154,.25) 40.3%,transparent 41%)!important;
}

.sade-map-user{
    --lm-color:#18aaff;
    --lm-soft:rgba(24,170,255,.18);
    position:absolute!important;
    left:var(--x)!important;
    top:var(--y)!important;
    width:106px!important;
    transform:translate(-50%,-50%)!important;
    text-align:center!important;
    z-index:3!important;
}

.sade-map-avatar{
    width:58px!important;
    height:58px!important;
    margin:0 auto 6px!important;
    position:relative!important;
    border-radius:50%!important;
    padding:3px!important;
    background:conic-gradient(from 0deg,var(--lm-color),rgba(255,255,255,.95),var(--lm-color))!important;
    box-shadow:0 0 22px var(--lm-soft)!important;
}

.sade-map-avatar img,
.sade-map-avatar span{
    width:100%!important;
    height:100%!important;
    border-radius:50%!important;
    border:2px solid #071024!important;
    background:#101a35!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    object-fit:cover!important;
    color:#dfeaff!important;
    font-weight:950!important;
    font-size:18px!important;
}

.sade-map-avatar em{
    position:absolute!important;
    right:0!important;
    bottom:2px!important;
    width:12px!important;
    height:12px!important;
    border-radius:50%!important;
    background:#2ce278!important;
    border:2px solid #071024!important;
    box-shadow:0 0 12px #2ce278!important;
}

.sade-map-name,
.sade-map-city{
    display:inline-flex!important;
    max-width:106px!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:999px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

.sade-map-name{
    padding:5px 9px!important;
    background:rgba(10,19,44,.86)!important;
    border:1px solid rgba(93,151,255,.20)!important;
    color:#fff!important;
    font-size:10px!important;
    font-weight:900!important;
}

.sade-map-city{
    margin-top:3px!important;
    padding:3px 8px!important;
    border:1px solid var(--lm-color)!important;
    background:rgba(6,16,33,.80)!important;
    color:var(--lm-color)!important;
    font-size:9px!important;
    font-weight:850!important;
    box-shadow:0 0 14px var(--lm-soft)!important;
}

.sade-map-user.role-owner{--lm-color:#ffd43b;--lm-soft:rgba(255,212,59,.24)}
.sade-map-user.role-founder{--lm-color:#ff3d9a;--lm-soft:rgba(255,61,154,.24)}
.sade-map-user.role-admin{--lm-color:#2ce278;--lm-soft:rgba(44,226,120,.22)}
.sade-map-user.gender-female{--lm-color:#ff3d9a;--lm-soft:rgba(255,61,154,.22)}
.sade-map-user.gender-male{--lm-color:#18aaff;--lm-soft:rgba(24,170,255,.22)}

@media(max-width:900px){
    .sade-live-map-inner{min-height:auto!important;padding:22px!important}
    .sade-live-map-head{align-items:flex-start!important;flex-direction:column!important}
    .sade-live-map-area{
        min-height:auto!important;
        display:grid!important;
        grid-template-columns:repeat(auto-fill,minmax(96px,1fr))!important;
        gap:16px!important;
        padding:20px!important;
    }
    .sade-live-map-line{display:none!important}
    .sade-map-user{
        position:relative!important;
        left:auto!important;
        top:auto!important;
        transform:none!important;
        width:100%!important;
    }
}


/* Canlı harita V3 görünürlük ve demo veri düzeltmesi */
body.ss327-sade .sade-live-map-lite{
    display:block !important;
    position:relative !important;
    padding:34px 0 40px !important;
    background:
        radial-gradient(circle at 16% 0%,rgba(145,76,255,.18),transparent 34%),
        radial-gradient(circle at 86% 18%,rgba(24,170,255,.12),transparent 30%),
        linear-gradient(180deg,#071327 0%,#061021 100%) !important;
}

body.ss327-sade .sade-live-map-shell{
    min-height:360px !important;
    border-radius:26px !important;
    border:1px solid rgba(93,151,255,.30) !important;
    background:
        radial-gradient(circle at 20% 0%,rgba(145,76,255,.18),transparent 34%),
        linear-gradient(180deg,rgba(12,29,59,.92),rgba(6,16,33,.96)) !important;
    box-shadow:0 24px 70px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.08) !important;
    overflow:hidden !important;
}

body.ss327-sade .sade-live-map-loading{
    min-height:360px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    color:#fff !important;
    gap:10px !important;
}

body.ss327-sade .sade-live-map-loading span{
    width:42px !important;
    height:42px !important;
    border-radius:50% !important;
    border:4px solid rgba(255,255,255,.16) !important;
    border-top-color:#19e1ff !important;
    animation:sadeMapLoadingSpin 1s linear infinite !important;
}

body.ss327-sade .sade-live-map-loading b{
    font-size:18px !important;
    font-weight:900 !important;
}

body.ss327-sade .sade-live-map-loading small{
    color:#9db0d4 !important;
    font-weight:700 !important;
}

@keyframes sadeMapLoadingSpin{to{transform:rotate(360deg)}}

body.ss327-sade .sade-live-map-inner{
    position:relative !important;
    min-height:360px !important;
    color:#fff !important;
}

body.ss327-sade .sade-live-map-head{
    position:relative !important;
    z-index:5 !important;
    min-height:76px !important;
    padding:18px 22px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:16px !important;
    border-bottom:1px solid rgba(93,151,255,.18) !important;
    background:linear-gradient(90deg,rgba(145,76,255,.22),rgba(24,170,255,.09)) !important;
}

body.ss327-sade .sade-live-map-title{
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
}

body.ss327-sade .sade-live-map-title i{
    width:46px !important;
    height:46px !important;
    border-radius:15px !important;
    display:grid !important;
    place-items:center !important;
    background:linear-gradient(135deg,#914cff,#18aaff) !important;
    color:#fff !important;
}

body.ss327-sade .sade-live-map-title strong{
    display:block !important;
    font-size:18px !important;
    font-weight:950 !important;
    color:#fff !important;
}

body.ss327-sade .sade-live-map-title span{
    display:block !important;
    margin-top:4px !important;
    color:#9db0d4 !important;
    font-size:13px !important;
    font-weight:700 !important;
}

body.ss327-sade .sade-live-map-count{
    height:34px !important;
    display:inline-flex !important;
    align-items:center !important;
    padding:0 14px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.07) !important;
    border:1px solid rgba(93,151,255,.25) !important;
    color:#eaf2ff !important;
    font-size:12px !important;
    font-weight:900 !important;
}

body.ss327-sade .sade-live-map-area{
    position:relative !important;
    min-height:360px !important;
    height:360px !important;
    background-image:radial-gradient(circle,rgba(255,255,255,.07) 1px,transparent 1.8px) !important;
    background-size:22px 22px !important;
    overflow:hidden !important;
}

body.ss327-sade .sade-live-map-line{
    position:absolute !important;
    left:12% !important;
    right:10% !important;
    top:50% !important;
    height:2px !important;
    border-radius:999px !important;
    background:linear-gradient(90deg,transparent,#18aaff,#914cff,#ff3d9a,transparent) !important;
    opacity:.32 !important;
    transform:rotate(-8deg) !important;
    pointer-events:none !important;
}

body.ss327-sade .sade-live-map-line.line-two{
    top:38% !important;
    left:20% !important;
    right:16% !important;
    transform:rotate(11deg) !important;
    opacity:.24 !important;
}

body.ss327-sade .sade-live-map-line.line-three{
    top:68% !important;
    left:18% !important;
    right:20% !important;
    transform:rotate(5deg) !important;
    opacity:.20 !important;
}

body.ss327-sade .sade-map-user{
    --lm-color:#18aaff;
    --lm-soft:rgba(24,170,255,.18);
    position:absolute !important;
    left:var(--x) !important;
    top:var(--y) !important;
    width:108px !important;
    transform:translate(-50%,-50%) !important;
    text-align:center !important;
    z-index:4 !important;
}

body.ss327-sade .sade-map-user.gender-female{--lm-color:#ff3d9a;--lm-soft:rgba(255,61,154,.22)}
body.ss327-sade .sade-map-user.role-owner{--lm-color:#ffbd32;--lm-soft:rgba(255,189,50,.22)}
body.ss327-sade .sade-map-user.role-admin{--lm-color:#2ce278;--lm-soft:rgba(44,226,120,.22)}
body.ss327-sade .sade-map-user.role-guest{--lm-color:#a78bfa;--lm-soft:rgba(167,139,250,.22)}

body.ss327-sade .sade-map-avatar{
    position:relative !important;
    width:58px !important;
    height:58px !important;
    margin:0 auto 6px !important;
    border-radius:50% !important;
    padding:3px !important;
    background:conic-gradient(from 0deg,var(--lm-color),#fff,var(--lm-color)) !important;
    box-shadow:0 0 24px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-avatar img,
body.ss327-sade .sade-map-avatar span{
    width:100% !important;
    height:100% !important;
    border-radius:50% !important;
    border:2px solid #071024 !important;
    background:#101a37 !important;
    color:#fff !important;
    object-fit:cover !important;
    display:grid !important;
    place-items:center !important;
    font-weight:950 !important;
    font-size:22px !important;
}

body.ss327-sade .sade-map-avatar em{
    position:absolute !important;
    right:0 !important;
    bottom:2px !important;
    width:13px !important;
    height:13px !important;
    border-radius:50% !important;
    background:#2ce278 !important;
    border:2px solid #071024 !important;
    box-shadow:0 0 0 5px rgba(44,226,120,.14),0 0 16px #2ce278 !important;
}

body.ss327-sade .sade-map-name,
body.ss327-sade .sade-map-city{
    max-width:108px !important;
    margin:0 auto !important;
    display:inline-flex !important;
    justify-content:center !important;
    align-items:center !important;
    border-radius:999px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

body.ss327-sade .sade-map-name{
    padding:5px 9px !important;
    background:rgba(6,16,33,.88) !important;
    border:1px solid rgba(93,151,255,.22) !important;
    color:#fff !important;
    font-size:10px !important;
    font-weight:950 !important;
}

body.ss327-sade .sade-map-city{
    margin-top:4px !important;
    padding:3px 8px !important;
    background:rgba(6,16,33,.74) !important;
    border:1px solid var(--lm-color) !important;
    color:#dff9ff !important;
    font-size:8.5px !important;
    font-weight:850 !important;
}

@media(max-width:900px){
    body.ss327-sade .sade-live-map-area{
        height:auto !important;
        min-height:0 !important;
        display:grid !important;
        grid-template-columns:repeat(auto-fill,minmax(105px,1fr)) !important;
        gap:16px !important;
        padding:22px !important;
    }

    body.ss327-sade .sade-live-map-line{
        display:none !important;
    }

    body.ss327-sade .sade-map-user{
        position:relative !important;
        left:auto !important;
        top:auto !important;
        transform:none !important;
        width:100% !important;
    }

    body.ss327-sade .sade-live-map-head{
        align-items:flex-start !important;
        flex-direction:column !important;
    }
}

/* ==================================================
   Canlı Harita Hover Animasyonları V4
   Avatar üstüne gelince kart yükselir, avatar büyür,
   konum etiketi ve bağlantı çizgileri canlanır.
================================================== */
body.ss327-sade .sade-live-map-area{
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-shell{
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-inner{
    overflow:visible !important;
}

body.ss327-sade .sade-map-user{
    transform:translate(-50%,-50%) translateY(0) scale(1) !important;
    transition:transform .28s cubic-bezier(.22,1,.36,1), filter .28s ease, z-index .01s linear !important;
    will-change:transform !important;
}

body.ss327-sade .sade-map-user::before{
    content:"" !important;
    position:absolute !important;
    left:50% !important;
    top:28px !important;
    width:2px !important;
    height:62px !important;
    transform:translateX(-50%) scaleY(.18) !important;
    transform-origin:top center !important;
    background:linear-gradient(180deg,var(--lm-color),transparent) !important;
    opacity:.0 !important;
    filter:drop-shadow(0 0 12px var(--lm-color)) !important;
    transition:transform .28s ease, opacity .28s ease !important;
    pointer-events:none !important;
    z-index:-1 !important;
}

body.ss327-sade .sade-map-user:hover,
body.ss327-sade .sade-map-user:focus-within{
    transform:translate(-50%,-50%) translateY(-14px) scale(1.13) !important;
    filter:drop-shadow(0 18px 30px rgba(0,0,0,.42)) !important;
    z-index:80 !important;
}

body.ss327-sade .sade-map-user:hover::before,
body.ss327-sade .sade-map-user:focus-within::before{
    opacity:.95 !important;
    transform:translateX(-50%) scaleY(1) !important;
}

body.ss327-sade .sade-map-avatar{
    transition:transform .28s cubic-bezier(.22,1,.36,1), box-shadow .28s ease, filter .28s ease !important;
    animation:sadeMapFloat 4.8s ease-in-out infinite !important;
}

body.ss327-sade .sade-map-user:nth-child(2n) .sade-map-avatar{animation-delay:.35s !important}
body.ss327-sade .sade-map-user:nth-child(3n) .sade-map-avatar{animation-delay:.75s !important}
body.ss327-sade .sade-map-user:nth-child(4n) .sade-map-avatar{animation-delay:1.05s !important}

body.ss327-sade .sade-map-user:hover .sade-map-avatar,
body.ss327-sade .sade-map-user:focus-within .sade-map-avatar{
    transform:scale(1.18) rotate(-4deg) !important;
    box-shadow:
        0 0 0 6px rgba(255,255,255,.06),
        0 0 34px var(--lm-color),
        0 22px 36px rgba(0,0,0,.38) !important;
    filter:saturate(1.18) brightness(1.08) !important;
    animation:none !important;
}

body.ss327-sade .sade-map-avatar::before{
    content:"" !important;
    position:absolute !important;
    inset:-10px !important;
    border-radius:50% !important;
    border:1px solid var(--lm-color) !important;
    opacity:0 !important;
    transform:scale(.82) !important;
    transition:opacity .28s ease, transform .28s ease !important;
    pointer-events:none !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-avatar::before,
body.ss327-sade .sade-map-user:focus-within .sade-map-avatar::before{
    opacity:.92 !important;
    transform:scale(1.08) !important;
    animation:sadeMapPulse 1.2s ease-in-out infinite !important;
}

body.ss327-sade .sade-map-name,
body.ss327-sade .sade-map-city{
    transition:transform .28s ease, border-color .28s ease, background .28s ease, box-shadow .28s ease, color .28s ease !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-name,
body.ss327-sade .sade-map-user:focus-within .sade-map-name{
    transform:translateY(-3px) scale(1.04) !important;
    border-color:var(--lm-color) !important;
    background:rgba(6,16,33,.96) !important;
    box-shadow:0 0 20px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-city,
body.ss327-sade .sade-map-user:focus-within .sade-map-city{
    transform:translateY(2px) scale(1.04) !important;
    color:#fff !important;
    background:rgba(6,16,33,.92) !important;
    box-shadow:0 0 18px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-user.status-offline{
    opacity:.58 !important;
    filter:grayscale(.65) !important;
}

body.ss327-sade .sade-map-user.status-idle .sade-map-avatar em{
    background:#ffbd32 !important;
    box-shadow:0 0 0 5px rgba(255,189,50,.14),0 0 16px #ffbd32 !important;
}

body.ss327-sade .sade-map-user.status-offline .sade-map-avatar em{
    background:#64748b !important;
    box-shadow:0 0 0 5px rgba(100,116,139,.14),0 0 12px #64748b !important;
}

@keyframes sadeMapFloat{
    0%,100%{transform:translateY(0)}
    50%{transform:translateY(-4px)}
}

@keyframes sadeMapPulse{
    0%,100%{opacity:.45;transform:scale(.96)}
    50%{opacity:1;transform:scale(1.12)}
}

@media(max-width:900px){
    body.ss327-sade .sade-map-user:hover,
    body.ss327-sade .sade-map-user:focus-within{
        transform:translateY(-8px) scale(1.05) !important;
    }
    body.ss327-sade .sade-map-user::before{
        display:none !important;
    }
}

@media(prefers-reduced-motion:reduce){
    body.ss327-sade .sade-map-avatar,
    body.ss327-sade .sade-map-user:hover .sade-map-avatar::before{
        animation:none !important;
    }
}

/* ==================================================
   Canlı Harita V5 - avatar/etiket kesilme ve resim görünmeme düzeltmesi
================================================== */
body.ss327-sade .sade-live-map-lite{
    padding-top:30px !important;
    padding-bottom:42px !important;
}

body.ss327-sade .sade-live-map-shell,
body.ss327-sade .sade-live-map-inner{
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-area{
    height:420px !important;
    min-height:420px !important;
    padding:0 !important;
    overflow:visible !important;
    isolation:isolate !important;
}

body.ss327-sade .sade-live-map-line{
    z-index:1 !important;
    opacity:.22 !important;
}

body.ss327-sade .sade-map-user{
    width:124px !important;
    z-index:5 !important;
}

body.ss327-sade .sade-map-user:hover,
body.ss327-sade .sade-map-user:focus-within{
    z-index:90 !important;
}

body.ss327-sade .sade-map-avatar{
    width:64px !important;
    height:64px !important;
    margin-bottom:8px !important;
}

body.ss327-sade .sade-map-avatar img,
body.ss327-sade .sade-map-avatar span{
    display:grid !important;
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    border-radius:50% !important;
}

body.ss327-sade .sade-map-avatar img[style*="display: none"] + span{
    display:grid !important;
}

body.ss327-sade .sade-map-name,
body.ss327-sade .sade-map-city{
    max-width:124px !important;
    min-width:74px !important;
    box-sizing:border-box !important;
    line-height:1.15 !important;
    position:relative !important;
    z-index:7 !important;
}

body.ss327-sade .sade-map-name{
    min-height:24px !important;
    padding:6px 10px !important;
    font-size:11px !important;
    letter-spacing:-.2px !important;
}

body.ss327-sade .sade-map-city{
    min-height:21px !important;
    margin-top:5px !important;
    padding:4px 9px !important;
    font-size:9.5px !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-name,
body.ss327-sade .sade-map-user:hover .sade-map-city{
    max-width:150px !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:clip !important;
    box-shadow:0 0 22px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-user.status-offline .sade-map-avatar em{
    background:#8fa0bf !important;
    box-shadow:0 0 12px rgba(143,160,191,.45) !important;
}

body.ss327-sade .sade-map-user.status-idle .sade-map-avatar em,
body.ss327-sade .sade-map-user.status-away .sade-map-avatar em{
    background:#ffbd32 !important;
    box-shadow:0 0 12px rgba(255,189,50,.65) !important;
}

@media(max-width:900px){
    body.ss327-sade .sade-live-map-area{
        height:auto !important;
        min-height:0 !important;
        overflow:hidden !important;
        padding:22px !important;
    }

    body.ss327-sade .sade-map-user{
        width:100% !important;
    }

    body.ss327-sade .sade-map-name,
    body.ss327-sade .sade-map-city{
        max-width:130px !important;
    }
}

/* ==================================================
   Canlı Harita V6 - 30 kullanıcı kaynak yerleşim düzeltmesi
================================================== */
body.ss327-sade .sade-live-map-shell,
body.ss327-sade .sade-live-map-inner{
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-area{
    height:520px !important;
    min-height:520px !important;
    overflow:visible !important;
}

body.ss327-sade .sade-map-user{
    width:132px !important;
}

body.ss327-sade .sade-map-name,
body.ss327-sade .sade-map-city{
    max-width:132px !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-name,
body.ss327-sade .sade-map-user:hover .sade-map-city{
    max-width:170px !important;
}

@media(max-width:900px){
    body.ss327-sade .sade-live-map-area{
        height:auto !important;
        min-height:0 !important;
        overflow:hidden !important;
    }
}

/* ==================================================
   Sohbet Sade Açık Ton Düzeltmesi
   CTA ve canlı kullanıcı haritasını koyu neon görünümden
   beyaz / açık mavi sade tema ile uyumlu hale getirir.
================================================== */

body.ss327-sade{
    background:#eef2ff !important;
}

body.ss327-sade .ss327-header.header,
body.ss327-sade .ss327-header{
    background:#eef2ff !important;
    background-image:
        radial-gradient(circle at 20% 0%, rgba(64,84,191,.10), transparent 34%),
        radial-gradient(circle at 85% 12%, rgba(36,173,255,.10), transparent 30%) !important;
}

/* Üst CTA alanı */
body.ss327-sade .ss327-header .sade-quick-actions,
body.ss327-sade .sade-quick-actions{
    background:transparent !important;
    padding:24px 0 22px !important;
}

body.ss327-sade .sade-quick-actions-grid{
    max-width:1120px !important;
    gap:18px !important;
}

body.ss327-sade .sade-action-card{
    min-height:96px !important;
    border-radius:24px !important;
    background:
        linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,250,255,.94)) !important;
    border:1px solid rgba(64,84,191,.18) !important;
    box-shadow:0 18px 42px rgba(64,84,191,.10) !important;
    color:#17245f !important;
}

body.ss327-sade .sade-action-card::before{
    background:
        radial-gradient(circle at 12% 0%, rgba(64,84,191,.12), transparent 38%),
        radial-gradient(circle at 86% 100%, rgba(233,30,99,.08), transparent 34%) !important;
    opacity:1 !important;
}

body.ss327-sade .sade-action-card::after{
    left:24px !important;
    right:24px !important;
    bottom:17px !important;
    height:3px !important;
    opacity:.85 !important;
}

body.ss327-sade .sade-action-chat::after{
    background:linear-gradient(90deg,#24adff,#4054bf,#e91e63) !important;
}

body.ss327-sade .sade-action-register::after{
    background:linear-gradient(90deg,#ff9f43,#e91e63,#4054bf) !important;
}

body.ss327-sade .sade-action-icon{
    box-shadow:0 14px 26px rgba(64,84,191,.18) !important;
}

body.ss327-sade .sade-action-body strong{
    color:#14205c !important;
    text-shadow:none !important;
}

body.ss327-sade .sade-action-body small{
    color:#6673a2 !important;
}

body.ss327-sade .sade-action-arrow{
    color:#4054bf !important;
    opacity:.72 !important;
}

/* Canlı harita ana bölümü */
body.ss327-sade .sade-live-map-lite{
    background:
        radial-gradient(circle at 12% 0%, rgba(64,84,191,.10), transparent 32%),
        radial-gradient(circle at 86% 10%, rgba(36,173,255,.10), transparent 30%),
        #eef2ff !important;
    padding:26px 0 44px !important;
}

body.ss327-sade .sade-live-map-shell{
    border-radius:28px !important;
    background:rgba(255,255,255,.92) !important;
    border:1px solid rgba(64,84,191,.18) !important;
    box-shadow:0 22px 58px rgba(64,84,191,.12) !important;
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-shell::before,
body.ss327-sade .sade-live-map-shell::after{
    display:none !important;
}

body.ss327-sade .sade-live-map-inner{
    color:#14205c !important;
    background:transparent !important;
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-head{
    margin:22px 22px 0 !important;
    min-height:78px !important;
    border-radius:22px !important;
    background:
        linear-gradient(90deg, rgba(64,84,191,.10), rgba(36,173,255,.08)) !important;
    border:1px solid rgba(64,84,191,.12) !important;
    box-shadow:0 12px 28px rgba(64,84,191,.08) !important;
}

body.ss327-sade .sade-live-map-title strong{
    color:#14205c !important;
    text-shadow:none !important;
}

body.ss327-sade .sade-live-map-title span{
    color:#6673a2 !important;
}

body.ss327-sade .sade-live-map-title i{
    background:linear-gradient(135deg,#4054bf,#24adff) !important;
    color:#fff !important;
    box-shadow:0 12px 24px rgba(64,84,191,.20) !important;
}

body.ss327-sade .sade-live-map-count{
    background:#fff !important;
    color:#14205c !important;
    border:1px solid rgba(64,84,191,.14) !important;
    box-shadow:0 10px 22px rgba(64,84,191,.08) !important;
}

/* Harita iç zemini */
body.ss327-sade .sade-live-map-area{
    margin:18px 22px 22px !important;
    border-radius:24px !important;
    border:1px solid rgba(64,84,191,.12) !important;
    background:
        radial-gradient(circle at 22% 28%, rgba(64,84,191,.08), transparent 30%),
        radial-gradient(circle at 76% 36%, rgba(36,173,255,.10), transparent 28%),
        linear-gradient(180deg,#fbfcff,#f3f6ff) !important;
    background-image:
        radial-gradient(circle, rgba(64,84,191,.12) 1px, transparent 1.8px),
        radial-gradient(circle at 22% 28%, rgba(64,84,191,.08), transparent 30%),
        radial-gradient(circle at 76% 36%, rgba(36,173,255,.10), transparent 28%),
        linear-gradient(180deg,#fbfcff,#f3f6ff) !important;
    background-size:22px 22px, auto, auto, auto !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.90) !important;
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-line{
    opacity:.22 !important;
    filter:none !important;
}

body.ss327-sade .sade-live-map-line.line-one,
body.ss327-sade .sade-live-map-line{
    background:linear-gradient(90deg, transparent, rgba(64,84,191,.35), rgba(233,30,99,.28), transparent) !important;
}

body.ss327-sade .sade-live-map-line.line-two{
    background:linear-gradient(90deg, transparent, rgba(36,173,255,.34), rgba(64,84,191,.28), transparent) !important;
}

body.ss327-sade .sade-live-map-line.line-three{
    background:linear-gradient(90deg, transparent, rgba(233,30,99,.20), rgba(64,84,191,.25), transparent) !important;
}

/* Kullanıcı noktaları */
body.ss327-sade .sade-map-avatar{
    background:conic-gradient(from 0deg, var(--lm-color), #fff, #4054bf, var(--lm-color)) !important;
    box-shadow:0 12px 28px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-avatar img,
body.ss327-sade .sade-map-avatar span{
    border-color:#fff !important;
    background:#eef2ff !important;
    color:#4054bf !important;
}

body.ss327-sade .sade-map-avatar em{
    border-color:#fff !important;
}

body.ss327-sade .sade-map-name{
    background:#ffffff !important;
    color:#14205c !important;
    border:1px solid rgba(64,84,191,.14) !important;
    box-shadow:0 8px 18px rgba(64,84,191,.08) !important;
}

body.ss327-sade .sade-map-city{
    background:#ffffff !important;
    color:var(--lm-color) !important;
    border:1px solid color-mix(in srgb, var(--lm-color) 58%, transparent) !important;
    box-shadow:0 8px 18px var(--lm-soft) !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-name,
body.ss327-sade .sade-map-user:hover .sade-map-city{
    background:#fff !important;
    box-shadow:0 14px 26px rgba(64,84,191,.14) !important;
}

/* Yükleniyor kutusu */
body.ss327-sade .sade-live-map-loading{
    color:#14205c !important;
    background:#fff !important;
    border-radius:24px !important;
    border:1px solid rgba(64,84,191,.14) !important;
}

body.ss327-sade .sade-live-map-loading b{
    color:#14205c !important;
}

body.ss327-sade .sade-live-map-loading small{
    color:#6673a2 !important;
}

@media(max-width:900px){
    body.ss327-sade .sade-live-map-head,
    body.ss327-sade .sade-live-map-area{
        margin-left:14px !important;
        margin-right:14px !important;
    }

    body.ss327-sade .sade-live-map-lite{
        padding-top:18px !important;
    }

    body.ss327-sade .sade-action-card{
        min-height:86px !important;
    }
}

/* ==================================================
   Canlı harita avatar harflerini kaldırma
   Görsel gelmeyen kullanıcılarda A/B/C gibi baş harf
   yerine sade kullanıcı ikonu gösterilir.
================================================== */
body.ss327-sade .sade-map-avatar span{
    font-size:0 !important;
    color:transparent !important;
    text-indent:-9999px !important;
    overflow:hidden !important;
    position:relative !important;
}

body.ss327-sade .sade-map-avatar span::before{
    content:"\f007" !important;
    font-family:"Font Awesome 6 Free","Font Awesome 5 Free",Arial,sans-serif !important;
    font-weight:900 !important;
    position:absolute !important;
    inset:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-indent:0 !important;
    font-size:23px !important;
    line-height:1 !important;
    color:#4054bf !important;
}

body.ss327-sade .sade-map-user.gender-female .sade-map-avatar span::before{
    content:"\f007" !important;
    color:#e91e63 !important;
}

body.ss327-sade .sade-map-user.role-owner .sade-map-avatar span::before{
    content:"\f521" !important;
    color:#ff9f43 !important;
}

body.ss327-sade .sade-map-user.role-admin .sade-map-avatar span::before{
    content:"\f505" !important;
    color:#4054bf !important;
}

body.ss327-sade .sade-map-user.role-guest .sade-map-avatar span::before{
    content:"\f007" !important;
    color:#6673a2 !important;
}

/* ==================================================
   Canlı harita avatar altındaki maske/gölge düzeltmesi
   Boş konum etiketi ve avatarın altında kalan eski hover çizgisi kapatıldı.
================================================== */

/* Hover animasyonundan kalan dikey gölge/maske çizgisini kapat */
body.ss327-sade .sade-map-user::before,
body.ss327-sade .sade-map-user::after{
    display:none !important;
    content:none !important;
    opacity:0 !important;
    visibility:hidden !important;
}

/* Boş konum etiketi varsa beyaz kapsül olarak görünmesin */
body.ss327-sade .sade-map-city:empty{
    display:none !important;
    margin:0 !important;
    padding:0 !important;
    border:0 !important;
    box-shadow:none !important;
    background:transparent !important;
}

/* Konum yazısı gerçek boşluk karakteriyle gelirse de kapsülü küçült/kapat */
body.ss327-sade .sade-map-city{
    min-width:0 !important;
}

body.ss327-sade .sade-map-city:has(> span:empty){
    display:none !important;
}

/* Avatarın altında kalan ikinci katman / maske hissini sıfırla */
body.ss327-sade .sade-map-avatar,
body.ss327-sade .sade-map-avatar img,
body.ss327-sade .sade-map-avatar span{
    -webkit-mask-image:none !important;
    mask-image:none !important;
}

body.ss327-sade .sade-map-user{
    filter:none !important;
}

body.ss327-sade .sade-map-user:hover,
body.ss327-sade .sade-map-user:focus-within{
    filter:drop-shadow(0 12px 22px rgba(64,84,191,.16)) !important;
}

/* Görsel yoksa ikon görünsün ama arkada harf/ikinci gölge kalmasın */
body.ss327-sade .sade-map-avatar span{
    box-shadow:none !important;
}

body.ss327-sade .sade-map-avatar span::after{
    display:none !important;
    content:none !important;
}

/* Etiketlerin altında gereksiz yansıma/çift görüntü oluşmasın */
body.ss327-sade .sade-map-name,
body.ss327-sade .sade-map-city{
    -webkit-box-reflect: unset !important;
    text-shadow:none !important;
}

/* ==================================================
   Canlı harita etiket ve üst ikon düzeltmesi
   Konum yazısı hover/click sırasında kaybolmaz.
   Arkada çıkan gereksiz maske/üçgen katmanlar kapatılır.
   Küçük rol ikonu avatar çerçevesinin üstüne alınır.
================================================== */

/* Kullanıcı kartı arkasındaki eski dekor/maske katmanlarını tamamen kapat */
body.ss327-sade .sade-map-user::before,
body.ss327-sade .sade-map-user::after,
body.ss327-sade .sade-map-name::before,
body.ss327-sade .sade-map-name::after,
body.ss327-sade .sade-map-city::before,
body.ss327-sade .sade-map-city::after{
    display:none !important;
    content:none !important;
    opacity:0 !important;
    visibility:hidden !important;
    background:none !important;
    border:0 !important;
    box-shadow:none !important;
}

/* İsim ve konum kapsülleri sabit kalsın; hover/click sırasında kaybolmasın */
body.ss327-sade .sade-map-user .sade-map-name,
body.ss327-sade .sade-map-user .sade-map-city,
body.ss327-sade .sade-map-user:hover .sade-map-name,
body.ss327-sade .sade-map-user:hover .sade-map-city,
body.ss327-sade .sade-map-user:focus .sade-map-name,
body.ss327-sade .sade-map-user:focus .sade-map-city,
body.ss327-sade .sade-map-user:focus-within .sade-map-name,
body.ss327-sade .sade-map-user:focus-within .sade-map-city,
body.ss327-sade .sade-map-user:active .sade-map-name,
body.ss327-sade .sade-map-user:active .sade-map-city{
    display:inline-flex !important;
    visibility:visible !important;
    opacity:1 !important;
    position:relative !important;
    z-index:15 !important;
    text-indent:0 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    transform:none !important;
    -webkit-box-reflect:unset !important;
    text-shadow:none !important;
}

/* Konum etiketi okunabilir olsun */
body.ss327-sade .sade-map-user .sade-map-city{
    min-width:76px !important;
    max-width:154px !important;
    min-height:22px !important;
    padding:4px 10px !important;
    color:#4054bf !important;
    background:#ffffff !important;
    border:1px solid rgba(64,84,191,.24) !important;
    box-shadow:0 8px 18px rgba(64,84,191,.10) !important;
    font-size:9.5px !important;
    line-height:1.15 !important;
}

/* Site sahibi / kadın gibi renklerde konum etiketi kenarı uyumlu kalsın */
body.ss327-sade .sade-map-user.role-owner .sade-map-city{
    color:#b06c00 !important;
    border-color:rgba(255,159,67,.70) !important;
}

body.ss327-sade .sade-map-user.gender-female .sade-map-city{
    color:#c2185b !important;
    border-color:rgba(233,30,99,.48) !important;
}

body.ss327-sade .sade-map-user.role-admin .sade-map-city{
    color:#4054bf !important;
    border-color:rgba(64,84,191,.48) !important;
}

/* Boş konum gelirse boş kapsül görünmesin */
body.ss327-sade .sade-map-city:empty{
    display:none !important;
}

/* Avatar çerçevesinin arkasında ikon/maske kalmasın */
body.ss327-sade .sade-map-avatar{
    overflow:visible !important;
    isolation:isolate !important;
}

body.ss327-sade .sade-map-avatar img,
body.ss327-sade .sade-map-avatar span{
    position:relative !important;
    z-index:2 !important;
}

/* Rol ikonu çerçevenin üstünde, küçük rozet şeklinde görünsün */
body.ss327-sade .sade-map-avatar::after{
    content:"\f075" !important;
    font-family:"Font Awesome 6 Free","Font Awesome 5 Free",Arial,sans-serif !important;
    font-weight:900 !important;
    position:absolute !important;
    right:-7px !important;
    top:-7px !important;
    width:22px !important;
    height:22px !important;
    border-radius:50% !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:8 !important;
    background:#ffffff !important;
    border:2px solid var(--lm-color) !important;
    color:var(--lm-color) !important;
    font-size:10px !important;
    line-height:1 !important;
    box-shadow:0 8px 18px var(--lm-soft) !important;
    pointer-events:none !important;
}

body.ss327-sade .sade-map-user.role-owner .sade-map-avatar::after{
    content:"\f521" !important;
    color:#d99000 !important;
    border-color:#ffbd32 !important;
}

body.ss327-sade .sade-map-user.role-admin .sade-map-avatar::after{
    content:"\f505" !important;
    color:#4054bf !important;
    border-color:#4054bf !important;
}

body.ss327-sade .sade-map-user.role-guest .sade-map-avatar::after{
    content:"\f27a" !important;
    color:#6673a2 !important;
    border-color:#8fa0bf !important;
}

/* Online yeşil nokta da önde kalsın */
body.ss327-sade .sade-map-avatar em{
    z-index:9 !important;
    right:-2px !important;
    bottom:1px !important;
}

/* Hover hareketi sade olsun; etiketleri ezmesin */
body.ss327-sade .sade-map-user:hover,
body.ss327-sade .sade-map-user:focus-within{
    transform:translate(-50%,-50%) translateY(-8px) scale(1.06) !important;
    z-index:90 !important;
}

body.ss327-sade .sade-map-user:hover .sade-map-city,
body.ss327-sade .sade-map-user:focus-within .sade-map-city{
    max-width:174px !important;
}

/* ==================================================
   Canlı Harita V8 - Profesyonel senkron harita görünümü
   Kaynak görseldeki panel mantığına göre temizlenmiş,
   avatar/rozet/etiket hizası düzeltilmiş sürüm.
================================================== */

body.ss327-sade .sade-live-map-lite{
    padding:32px 0 52px !important;
    background:
        radial-gradient(circle at 18% 0%,rgba(145,76,255,.18),transparent 34%),
        radial-gradient(circle at 86% 12%,rgba(24,170,255,.13),transparent 32%),
        linear-gradient(180deg,#071327 0%,#061021 100%) !important;
}

body.ss327-sade .sade-live-map-shell{
    max-width:1340px !important;
    margin:0 auto !important;
    min-height:auto !important;
    border:0 !important;
    border-radius:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    overflow:visible !important;
}

body.ss327-sade .sade-live-map-shell::before,
body.ss327-sade .sade-live-map-shell::after{
    display:none !important;
}

body.ss327-sade .ss-pro-live-map{
    position:relative !important;
    isolation:isolate !important;
    min-height:520px !important;
    padding:0 !important;
    border-radius:28px !important;
    overflow:hidden !important;
    color:#fff !important;
    background:
        radial-gradient(circle at 12% 0%,rgba(145,76,255,.23),transparent 34%),
        radial-gradient(circle at 72% 22%,rgba(255,61,154,.14),transparent 28%),
        linear-gradient(180deg,rgba(12,29,59,.96),rgba(6,16,33,.98)) !important;
    border:1px solid rgba(93,151,255,.30) !important;
    box-shadow:0 28px 80px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

body.ss327-sade .ss-pro-live-map::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    background-image:radial-gradient(circle,rgba(255,255,255,.08) 1px,transparent 1.8px) !important;
    background-size:22px 22px !important;
    opacity:.13 !important;
    pointer-events:none !important;
    z-index:0 !important;
}

body.ss327-sade .ss-pro-live-map::after{
    content:"" !important;
    position:absolute !important;
    left:0 !important;
    right:0 !important;
    top:0 !important;
    height:3px !important;
    background:linear-gradient(90deg,#18aaff,#914cff,#ff3d9a,#19e1ff) !important;
    opacity:.95 !important;
    z-index:4 !important;
    pointer-events:none !important;
}

body.ss327-sade .ss-pro-map-head{
    position:relative !important;
    z-index:3 !important;
    margin:22px 24px 0 !important;
    min-height:78px !important;
    padding:18px 22px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:18px !important;
    border-radius:0 !important;
    background:linear-gradient(90deg,rgba(145,76,255,.26),rgba(24,170,255,.10)) !important;
    border:1px solid rgba(93,151,255,.14) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06) !important;
}

body.ss327-sade .ss-pro-map-title{
    display:flex !important;
    align-items:center !important;
    gap:14px !important;
    min-width:0 !important;
}

body.ss327-sade .ss-pro-map-icon{
    width:52px !important;
    height:52px !important;
    min-width:52px !important;
    border-radius:17px !important;
    display:grid !important;
    place-items:center !important;
    background:linear-gradient(135deg,#914cff,#18aaff) !important;
    color:#fff !important;
    font-size:21px !important;
    box-shadow:0 0 30px rgba(145,76,255,.34) !important;
}

body.ss327-sade .ss-pro-map-title strong{
    display:block !important;
    color:#fff !important;
    font-size:18px !important;
    line-height:1.08 !important;
    font-weight:950 !important;
    letter-spacing:-.03em !important;
    text-transform:uppercase !important;
}

body.ss327-sade .ss-pro-map-title small{
    display:block !important;
    margin-top:6px !important;
    color:#9fb3d5 !important;
    font-size:12.5px !important;
    font-weight:750 !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

body.ss327-sade .ss-pro-map-pill{
    display:inline-flex !important;
    align-items:center !important;
    gap:9px !important;
    min-height:38px !important;
    padding:0 15px !important;
    border-radius:999px !important;
    background:rgba(255,255,255,.065) !important;
    border:1px solid rgba(93,151,255,.28) !important;
    color:#eaf4ff !important;
    font-size:12px !important;
    font-weight:900 !important;
    white-space:nowrap !important;
}

body.ss327-sade .ss-pro-map-pill i{
    width:10px !important;
    height:10px !important;
    border-radius:50% !important;
    background:#2ce278 !important;
    box-shadow:0 0 0 6px rgba(44,226,120,.12),0 0 18px #2ce278 !important;
}

body.ss327-sade .ss-pro-map-stage{
    position:relative !important;
    z-index:2 !important;
    min-height:420px !important;
    height:420px !important;
    margin:18px 24px 24px !important;
    border-radius:24px !important;
    overflow:visible !important;
    background:
        radial-gradient(circle at 49% 40%,rgba(255,61,154,.18),transparent 16%),
        radial-gradient(circle at 70% 58%,rgba(145,76,255,.18),transparent 15%),
        radial-gradient(circle at 23% 45%,rgba(255,189,50,.10),transparent 18%),
        radial-gradient(circle at 62% 31%,rgba(44,226,120,.10),transparent 14%),
        linear-gradient(180deg,rgba(8,21,44,.52),rgba(4,13,29,.44)) !important;
    border:1px solid rgba(93,151,255,.18) !important;
}

body.ss327-sade .ss-pro-map-stage::before{
    content:"" !important;
    position:absolute !important;
    inset:0 !important;
    border-radius:inherit !important;
    background-image:radial-gradient(circle,rgba(255,255,255,.075) 1px,transparent 1.8px) !important;
    background-size:22px 22px !important;
    opacity:.35 !important;
    pointer-events:none !important;
}

body.ss327-sade .ss-pro-map-glow{
    position:absolute !important;
    border-radius:50% !important;
    pointer-events:none !important;
    filter:blur(18px) !important;
    opacity:.38 !important;
    z-index:0 !important;
}

body.ss327-sade .ss-glow-one{left:12%;top:18%;width:210px;height:160px;background:rgba(24,170,255,.18)}
body.ss327-sade .ss-glow-two{right:18%;top:22%;width:230px;height:170px;background:rgba(255,61,154,.16)}
body.ss327-sade .ss-glow-three{left:42%;bottom:7%;width:250px;height:160px;background:rgba(145,76,255,.15)}

body.ss327-sade .ss-pro-map-lines{
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    z-index:1 !important;
    pointer-events:none !important;
    opacity:.95 !important;
    overflow:visible !important;
}

body.ss327-sade .ss-pro-map-lines path{
    fill:none !important;
    stroke-width:2.2 !important;
    stroke-linecap:round !important;
    stroke-linejoin:round !important;
}

body.ss327-sade .ss-pro-map-users{
    position:absolute !important;
    inset:34px 44px 32px !important;
    z-index:4 !important;
}

body.ss327-sade .ss-pro-user{
    --lm-color:#18aaff;
    --lm-soft:rgba(24,170,255,.18);
    position:absolute !important;
    left:var(--x) !important;
    top:var(--y) !important;
    width:96px !important;
    transform:translate(-50%,-50%) !important;
    text-align:center !important;
    z-index:4 !important;
    transition:transform .22s ease, filter .22s ease, z-index .22s ease !important;
    outline:0 !important;
}

body.ss327-sade .ss-pro-user.gender-female{--lm-color:#ff3d9a;--lm-soft:rgba(255,61,154,.22)}
body.ss327-sade .ss-pro-user.role-owner{--lm-color:#ffbd32;--lm-soft:rgba(255,189,50,.24)}
body.ss327-sade .ss-pro-user.role-admin{--lm-color:#2ce278;--lm-soft:rgba(44,226,120,.22)}
body.ss327-sade .ss-pro-user.role-guest{--lm-color:#a78bfa;--lm-soft:rgba(167,139,250,.22)}

body.ss327-sade .ss-pro-user:hover,
body.ss327-sade .ss-pro-user:focus-within{
    transform:translate(-50%,-50%) translateY(-8px) scale(1.08) !important;
    filter:drop-shadow(0 16px 26px rgba(0,0,0,.38)) !important;
    z-index:80 !important;
}

body.ss327-sade .ss-pro-avatar{
    position:relative !important;
    width:60px !important;
    height:60px !important;
    margin:0 auto 6px !important;
    border-radius:50% !important;
    padding:3px !important;
    background:conic-gradient(from 0deg,var(--lm-color),#fff,var(--lm-color)) !important;
    box-shadow:0 0 24px var(--lm-soft),0 10px 24px rgba(0,0,0,.18) !important;
    overflow:visible !important;
}

body.ss327-sade .ss-pro-avatar img,
body.ss327-sade .ss-pro-avatar-fallback{
    width:100% !important;
    height:100% !important;
    border-radius:50% !important;
    border:2px solid #071024 !important;
    object-fit:cover !important;
    display:block !important;
    background:#111a2f !important;
    position:relative !important;
    z-index:2 !important;
}

body.ss327-sade .ss-pro-avatar-fallback{
    display:none !important;
    place-items:center !important;
    color:#fff !important;
    font-size:22px !important;
}

body.ss327-sade .ss-pro-status-dot{
    position:absolute !important;
    right:-1px !important;
    bottom:3px !important;
    width:13px !important;
    height:13px !important;
    border-radius:50% !important;
    background:#2ce278 !important;
    border:2px solid #071024 !important;
    box-shadow:0 0 0 5px rgba(44,226,120,.14),0 0 16px #2ce278 !important;
    z-index:8 !important;
}

body.ss327-sade .ss-pro-user.status-offline .ss-pro-status-dot{
    background:#8fa0bf !important;
    box-shadow:0 0 12px rgba(143,160,191,.45) !important;
}

body.ss327-sade .ss-pro-user.status-idle .ss-pro-status-dot,
body.ss327-sade .ss-pro-user.status-away .ss-pro-status-dot{
    background:#ffbd32 !important;
    box-shadow:0 0 12px rgba(255,189,50,.65) !important;
}

body.ss327-sade .ss-pro-badge{
    position:absolute !important;
    right:-8px !important;
    top:-8px !important;
    width:21px !important;
    height:21px !important;
    border-radius:50% !important;
    display:grid !important;
    place-items:center !important;
    background:#071024 !important;
    border:1px solid var(--lm-color) !important;
    color:var(--lm-color) !important;
    font-size:10px !important;
    line-height:1 !important;
    box-shadow:0 0 12px var(--lm-soft) !important;
    z-index:9 !important;
    pointer-events:none !important;
}

body.ss327-sade .ss-pro-badge::before{
    content:"\f075" !important;
    font-family:"Font Awesome 6 Free","Font Awesome 5 Free",Arial,sans-serif !important;
    font-weight:900 !important;
}

body.ss327-sade .ss-pro-user.role-owner .ss-pro-badge::before{content:"\f521" !important}
body.ss327-sade .ss-pro-user.role-admin .ss-pro-badge::before{content:"\f505" !important}
body.ss327-sade .ss-pro-user.role-guest .ss-pro-badge::before{content:"\f27a" !important}

body.ss327-sade .ss-pro-name,
body.ss327-sade .ss-pro-place{
    max-width:96px !important;
    margin:0 auto !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:999px !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    position:relative !important;
    z-index:6 !important;
}

body.ss327-sade .ss-pro-name{
    min-height:24px !important;
    padding:5px 10px !important;
    background:rgba(10,19,44,.86) !important;
    border:1px solid rgba(93,151,255,.22) !important;
    color:#fff !important;
    font-size:10.5px !important;
    line-height:1.1 !important;
    font-weight:900 !important;
    box-shadow:0 8px 18px rgba(0,0,0,.18) !important;
}

body.ss327-sade .ss-pro-place{
    min-height:20px !important;
    margin-top:4px !important;
    padding:3px 8px !important;
    background:rgba(10,19,44,.76) !important;
    border:1px solid var(--lm-color) !important;
    color:#dff9ff !important;
    font-size:8.5px !important;
    line-height:1.15 !important;
    font-weight:850 !important;
    text-shadow:0 0 8px var(--lm-soft) !important;
}

body.ss327-sade .ss-pro-user.role-owner .ss-pro-place{color:#ffe9a8 !important}
body.ss327-sade .ss-pro-user.gender-female .ss-pro-place{color:#ffd8ed !important}

body.ss327-sade .ss-pro-user:hover .ss-pro-name,
body.ss327-sade .ss-pro-user:hover .ss-pro-place,
body.ss327-sade .ss-pro-user:focus-within .ss-pro-name,
body.ss327-sade .ss-pro-user:focus-within .ss-pro-place{
    max-width:142px !important;
    overflow:visible !important;
    text-overflow:clip !important;
    box-shadow:0 0 22px var(--lm-soft),0 10px 22px rgba(0,0,0,.22) !important;
}

body.ss327-sade .ss-pro-user::before,
body.ss327-sade .ss-pro-user::after,
body.ss327-sade .ss-pro-name::before,
body.ss327-sade .ss-pro-name::after,
body.ss327-sade .ss-pro-place::before,
body.ss327-sade .ss-pro-place::after{
    display:none !important;
    content:none !important;
}

@media(max-width:900px){
    body.ss327-sade .sade-live-map-lite{
        padding:20px 0 34px !important;
    }

    body.ss327-sade .ss-pro-map-head{
        align-items:flex-start !important;
        flex-direction:column !important;
        margin:14px 14px 0 !important;
    }

    body.ss327-sade .ss-pro-map-stage{
        height:auto !important;
        min-height:0 !important;
        margin:14px !important;
        padding:20px !important;
    }

    body.ss327-sade .ss-pro-map-lines,
    body.ss327-sade .ss-pro-map-glow{
        display:none !important;
    }

    body.ss327-sade .ss-pro-map-users{
        position:relative !important;
        inset:auto !important;
        display:grid !important;
        grid-template-columns:repeat(auto-fill,minmax(104px,1fr)) !important;
        gap:16px !important;
    }

    body.ss327-sade .ss-pro-user{
        position:relative !important;
        left:auto !important;
        top:auto !important;
        transform:none !important;
        width:100% !important;
    }

    body.ss327-sade .ss-pro-user:hover,
    body.ss327-sade .ss-pro-user:focus-within{
        transform:translateY(-5px) !important;
    }
}

/* ==================================================
   Canlı Harita V9 - Sade arka plan + senkron kaynak görünümü
   Koyu neon zemin yerine Sohbet açık/sade tema uyumu.
================================================== */
body.ss327-sade .sade-live-map-lite{
    padding:28px 0 46px !important;
    background:
        radial-gradient(circle at 18% 0%,rgba(64,84,191,.10),transparent 34%),
        radial-gradient(circle at 86% 12%,rgba(36,173,255,.10),transparent 32%),
        #eef2ff !important;
}

body.ss327-sade .ss-pro-live-map{
    min-height:520px !important;
    background:
        radial-gradient(circle at 12% 0%,rgba(64,84,191,.10),transparent 34%),
        radial-gradient(circle at 78% 18%,rgba(36,173,255,.09),transparent 30%),
        linear-gradient(180deg,rgba(255,255,255,.98),rgba(246,248,255,.96)) !important;
    border:1px solid rgba(64,84,191,.18) !important;
    box-shadow:0 24px 64px rgba(64,84,191,.13), inset 0 1px 0 rgba(255,255,255,.90) !important;
    color:#14205c !important;
}

body.ss327-sade .ss-pro-live-map::before{
    background-image:radial-gradient(circle,rgba(64,84,191,.12) 1px,transparent 1.8px) !important;
    opacity:.34 !important;
}

body.ss327-sade .ss-pro-live-map::after{
    background:linear-gradient(90deg,#24adff,#4054bf,#e91e63,#24adff) !important;
}

body.ss327-sade .ss-pro-map-head{
    background:linear-gradient(90deg,rgba(64,84,191,.09),rgba(36,173,255,.07)) !important;
    border:1px solid rgba(64,84,191,.12) !important;
    box-shadow:0 10px 26px rgba(64,84,191,.08) !important;
}

body.ss327-sade .ss-pro-map-title strong{
    color:#14205c !important;
    text-shadow:none !important;
}

body.ss327-sade .ss-pro-map-title small{
    color:#6673a2 !important;
}

body.ss327-sade .ss-pro-map-icon{
    background:linear-gradient(135deg,#4054bf,#24adff) !important;
    box-shadow:0 12px 24px rgba(64,84,191,.20) !important;
}

body.ss327-sade .ss-pro-map-pill{
    background:#fff !important;
    color:#14205c !important;
    border:1px solid rgba(64,84,191,.16) !important;
    box-shadow:0 10px 22px rgba(64,84,191,.08) !important;
}

body.ss327-sade .ss-pro-map-stage{
    background:
        radial-gradient(circle at 49% 40%,rgba(233,30,99,.08),transparent 17%),
        radial-gradient(circle at 70% 58%,rgba(64,84,191,.09),transparent 16%),
        radial-gradient(circle at 24% 45%,rgba(255,189,50,.07),transparent 19%),
        linear-gradient(180deg,#fbfcff,#f2f5ff) !important;
    border:1px solid rgba(64,84,191,.12) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.92) !important;
}

body.ss327-sade .ss-pro-map-stage::before{
    background-image:radial-gradient(circle,rgba(64,84,191,.12) 1px,transparent 1.8px) !important;
    opacity:.38 !important;
}

body.ss327-sade .ss-pro-map-lines{
    opacity:.48 !important;
}

body.ss327-sade .ss-pro-map-lines path{
    stroke-width:2 !important;
}

body.ss327-sade .ss-pro-map-glow{
    opacity:.15 !important;
}

body.ss327-sade .ss-pro-avatar{
    box-shadow:0 0 0 4px rgba(255,255,255,.70),0 12px 26px var(--lm-soft) !important;
}

body.ss327-sade .ss-pro-avatar img,
body.ss327-sade .ss-pro-avatar-fallback{
    border-color:#fff !important;
    background:#eef2ff !important;
}

body.ss327-sade .ss-pro-badge{
    background:#fff !important;
    border:1px solid var(--lm-color) !important;
    color:var(--lm-color) !important;
    box-shadow:0 8px 18px var(--lm-soft) !important;
}

body.ss327-sade .ss-pro-status-dot{
    border-color:#fff !important;
}

body.ss327-sade .ss-pro-name{
    background:#ffffff !important;
    color:#14205c !important;
    border:1px solid rgba(64,84,191,.14) !important;
    box-shadow:0 8px 18px rgba(64,84,191,.10) !important;
}

body.ss327-sade .ss-pro-place{
    background:#ffffff !important;
    color:var(--lm-color) !important;
    border:1px solid color-mix(in srgb,var(--lm-color) 58%,transparent) !important;
    text-shadow:none !important;
    box-shadow:0 8px 18px var(--lm-soft) !important;
}

body.ss327-sade .ss-pro-user:hover .ss-pro-name,
body.ss327-sade .ss-pro-user:hover .ss-pro-place,
body.ss327-sade .ss-pro-user:focus-within .ss-pro-name,
body.ss327-sade .ss-pro-user:focus-within .ss-pro-place{
    background:#fff !important;
    color:#14205c !important;
    box-shadow:0 14px 28px rgba(64,84,191,.16) !important;
}

/* ==================================================
   Üst Hızlı Giriş Kartları - admin entegrasyon ve geniş alan
================================================== */
body.ss327-sade .ss327-header .sade-quick-actions{
    padding:26px 0 28px !important;
    background:
        radial-gradient(circle at 12% 0%,rgba(64,84,191,.12),transparent 34%),
        radial-gradient(circle at 86% 16%,rgba(36,173,255,.10),transparent 30%),
        linear-gradient(180deg,#eef2ff 0%,#eaf0ff 100%) !important;
    border-top:1px solid rgba(64,84,191,.12) !important;
    border-bottom:1px solid rgba(64,84,191,.12) !important;
}

body.ss327-sade .ss327-header .sade-quick-actions::before{
    opacity:.16 !important;
    background-image:
        linear-gradient(90deg,rgba(64,84,191,.18) 1px,transparent 1px),
        linear-gradient(180deg,rgba(64,84,191,.12) 1px,transparent 1px) !important;
}

body.ss327-sade .sade-quick-wide{
    width:min(100%,1440px) !important;
    max-width:1440px !important;
    padding-left:32px !important;
    padding-right:32px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

body.ss327-sade .sade-quick-actions-grid{
    grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) !important;
    gap:22px !important;
}

body.ss327-sade .sade-action-db-card{
    --sade-card-color:#4054bf;
    min-height:104px !important;
    padding:22px 28px !important;
    border-radius:24px !important;
    background:
        linear-gradient(135deg,rgba(255,255,255,.96),rgba(255,255,255,.82)),
        var(--sade-card-bg, none) !important;
    background-size:cover !important;
    background-position:center !important;
    border:1px solid color-mix(in srgb,var(--sade-card-color) 24%,transparent) !important;
    box-shadow:0 18px 42px rgba(64,84,191,.10), inset 0 1px 0 rgba(255,255,255,.90) !important;
    color:#14205c !important;
}

body.ss327-sade .sade-action-db-card::before{
    background:
        radial-gradient(circle at 14% 20%, color-mix(in srgb,var(--sade-card-color) 14%,transparent), transparent 42%),
        radial-gradient(circle at 90% 100%, rgba(233,30,99,.08), transparent 36%) !important;
    opacity:1 !important;
}

body.ss327-sade .sade-action-db-card::after{
    background:linear-gradient(90deg,#24adff,var(--sade-card-color),#e91e63) !important;
}

body.ss327-sade .sade-action-db-card .sade-action-icon{
    background:linear-gradient(135deg,var(--sade-card-color),#24adff) !important;
    box-shadow:0 14px 26px color-mix(in srgb,var(--sade-card-color) 24%,transparent) !important;
    overflow:hidden !important;
}

body.ss327-sade .sade-action-db-card .sade-action-icon img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

body.ss327-sade .sade-action-db-card .sade-action-body strong{
    color:#14205c !important;
    text-shadow:none !important;
}

body.ss327-sade .sade-action-db-card .sade-action-body small{
    color:#6673a2 !important;
}

body.ss327-sade .sade-action-db-card .sade-action-arrow{
    color:var(--sade-card-color) !important;
}

body.ss327-sade .sade-action-db-card.is-disabled{
    opacity:.62 !important;
    cursor:not-allowed !important;
    filter:grayscale(.25) !important;
}

@media(max-width:991px){
    body.ss327-sade .sade-quick-wide{
        padding-left:18px !important;
        padding-right:18px !important;
    }

    body.ss327-sade .sade-quick-actions-grid{
        grid-template-columns:1fr !important;
    }
}

/* ==================================================
   Sidebar / Trend Yazılar taşma düzeltmesi
   Başlıklar kutu dışına çıkmasın, tek/iki satırda kırpılsın.
================================================== */

/* Sidebar kartları kutu dışına taşmasın */
body.ss327-sade .ss327-sidebar,
body.ss327-sade .ss327-side-card,
body.ss327-sade .sidebar,
body.ss327-sade aside,
body.ss327-sade [class*="trend"],
body.ss327-sade [class*="popular"],
body.ss327-sade [class*="okunan"]{
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Trend / çok okunan satırları sabit kutu içinde kalsın */
body.ss327-sade .ss327-side-card a,
body.ss327-sade .ss327-mini-post,
body.ss327-sade .ss327-side-link,
body.ss327-sade .trend-post,
body.ss327-sade .trend-item,
body.ss327-sade .popular-post,
body.ss327-sade .popular-item,
body.ss327-sade .most-read-item,
body.ss327-sade .okunan-item,
body.ss327-sade [class*="trend"] a,
body.ss327-sade [class*="popular"] a,
body.ss327-sade [class*="okunan"] a{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
}

/* Resim ve sıra numarası sabit kalsın, yazı alanı esnesin */
body.ss327-sade .ss327-mini-post > i,
body.ss327-sade .ss327-mini-post > img,
body.ss327-sade .trend-post > i,
body.ss327-sade .trend-post > img,
body.ss327-sade .trend-item > i,
body.ss327-sade .trend-item > img,
body.ss327-sade .popular-post > i,
body.ss327-sade .popular-post > img,
body.ss327-sade .popular-item > i,
body.ss327-sade .popular-item > img,
body.ss327-sade [class*="trend"] a > img,
body.ss327-sade [class*="popular"] a > img,
body.ss327-sade [class*="okunan"] a > img{
    flex:0 0 auto !important;
}

/* Yazı gövdesi küçülebilsin */
body.ss327-sade .ss327-mini-post span,
body.ss327-sade .ss327-mini-post div,
body.ss327-sade .ss327-side-link span,
body.ss327-sade .ss327-side-link div,
body.ss327-sade .trend-post span,
body.ss327-sade .trend-post div,
body.ss327-sade .trend-item span,
body.ss327-sade .trend-item div,
body.ss327-sade .popular-post span,
body.ss327-sade .popular-post div,
body.ss327-sade .popular-item span,
body.ss327-sade .popular-item div,
body.ss327-sade .most-read-item span,
body.ss327-sade .most-read-item div,
body.ss327-sade [class*="trend"] a span,
body.ss327-sade [class*="trend"] a div,
body.ss327-sade [class*="popular"] a span,
body.ss327-sade [class*="popular"] a div,
body.ss327-sade [class*="okunan"] a span,
body.ss327-sade [class*="okunan"] a div{
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
}

/* Başlıklar dışarı taşmasın */
body.ss327-sade .ss327-mini-post span,
body.ss327-sade .trend-title,
body.ss327-sade .popular-title,
body.ss327-sade .most-read-title,
body.ss327-sade .post-title,
body.ss327-sade [class*="trend"] h3,
body.ss327-sade [class*="trend"] h4,
body.ss327-sade [class*="trend"] strong,
body.ss327-sade [class*="popular"] h3,
body.ss327-sade [class*="popular"] h4,
body.ss327-sade [class*="popular"] strong,
body.ss327-sade [class*="okunan"] h3,
body.ss327-sade [class*="okunan"] h4,
body.ss327-sade [class*="okunan"] strong{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    white-space:normal !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    max-width:100% !important;
    line-height:1.28 !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
}

/* Tek satır olması gereken küçük meta bilgileri düzgün kalsın */
body.ss327-sade [class*="trend"] small,
body.ss327-sade [class*="popular"] small,
body.ss327-sade [class*="okunan"] small,
body.ss327-sade .ss327-mini-post small{
    display:block !important;
    max-width:100% !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
}

/* Görseldeki gibi beyaz sidebar kutularında iç boşluk daha kontrollü olsun */
body.ss327-sade .ss327-side-card,
body.ss327-sade [class*="trend"].card,
body.ss327-sade [class*="popular"].card,
body.ss327-sade [class*="okunan"].card{
    overflow:hidden !important;
}

/* Mobilde daha rahat okunsun */
@media(max-width:991px){
    body.ss327-sade .ss327-side-card a,
    body.ss327-sade .ss327-mini-post,
    body.ss327-sade [class*="trend"] a,
    body.ss327-sade [class*="popular"] a,
    body.ss327-sade [class*="okunan"] a{
        min-height:54px !important;
    }
}

/* ==================================================
   Header / Hızlı Giriş / Harita eş genişlik düzeltmesi
   Üç ana üst blok aynı kabuk genişliğine oturur.
================================================== */

body.ss327-sade{
    --ss-page-shell: 1340px;
    --ss-page-gutter: 32px;
}

/* Üst menü kabuğu harita ile aynı genişlikte */
body.ss327-sade .ss327-header > .container.pt-5,
body.ss327-sade .ss327-header > .container{
    width:calc(100% - (var(--ss-page-gutter) * 2)) !important;
    max-width:var(--ss-page-shell) !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

body.ss327-sade .ss327-navbox{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Hızlı giriş kartları harita ile aynı genişlikte */
body.ss327-sade .sade-quick-wide,
body.ss327-sade .ss327-header .sade-quick-actions .container,
body.ss327-sade .sade-quick-actions .container{
    width:calc(100% - (var(--ss-page-gutter) * 2)) !important;
    max-width:var(--ss-page-shell) !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

body.ss327-sade .sade-quick-actions-grid{
    width:100% !important;
    max-width:100% !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
}

/* Harita kabuğu da aynı ölçüye sabitlenir */
body.ss327-sade .sade-live-map-lite > .container,
body.ss327-sade .sade-live-map-lite .container{
    width:calc(100% - (var(--ss-page-gutter) * 2)) !important;
    max-width:var(--ss-page-shell) !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

body.ss327-sade .sade-live-map-shell{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Üst blokların dikey boşluğu daha dengeli olsun */
body.ss327-sade .ss327-header .sade-quick-actions{
    padding-top:28px !important;
    padding-bottom:28px !important;
}

body.ss327-sade .sade-live-map-lite{
    padding-top:30px !important;
}

/* Orta ekranlarda da aynı hizayı koru */
@media(max-width:1200px){
    body.ss327-sade{
        --ss-page-gutter: 24px;
    }
}

/* Mobilde taşmayı engelle */
@media(max-width:768px){
    body.ss327-sade{
        --ss-page-gutter: 14px;
    }

    body.ss327-sade .sade-quick-actions-grid{
        grid-template-columns:1fr !important;
    }

    body.ss327-sade .ss327-navbox{
        padding-left:20px !important;
        padding-right:20px !important;
    }
}

/* ==================================================
   Footer eş genişlik düzeltmesi
   Footer iç kutusu header / CTA / harita ile aynı kabuk genişliğine oturur.
   Tüm sade tema sayfalarında geçerlidir.
================================================== */

body.ss327-sade{
    --ss-page-shell: 1340px;
    --ss-page-gutter: 32px;
}

/* Footer ana bölümünü sayfa genişliğine yay, içeriği ortak kabukta tut */
body.ss327-sade footer,
body.ss327-sade .footer,
body.ss327-sade .site-footer,
body.ss327-sade .ss327-footer,
body.ss327-sade .sade-footer{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Footer iç container'larını header/harita ile eşitle */
body.ss327-sade footer > .container,
body.ss327-sade footer .container,
body.ss327-sade .footer > .container,
body.ss327-sade .footer .container,
body.ss327-sade .site-footer > .container,
body.ss327-sade .site-footer .container,
body.ss327-sade .ss327-footer > .container,
body.ss327-sade .ss327-footer .container,
body.ss327-sade .sade-footer > .container,
body.ss327-sade .sade-footer .container{
    width:calc(100% - (var(--ss-page-gutter) * 2)) !important;
    max-width:var(--ss-page-shell) !important;
    padding-left:0 !important;
    padding-right:0 !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Görseldeki büyük beyaz footer kutusu genişlesin */
body.ss327-sade .ss327-footer-box,
body.ss327-sade .footer-box,
body.ss327-sade .footer-card,
body.ss327-sade .footer-content,
body.ss327-sade .sade-footer-box,
body.ss327-sade .sade-footer-card{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Footer kolonları geniş alanda daha dengeli dağılsın */
body.ss327-sade .ss327-footer-grid,
body.ss327-sade .footer-grid,
body.ss327-sade .footer-links,
body.ss327-sade .sade-footer-grid{
    width:100% !important;
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Eski dar footer paneli varsa ortak genişlikte zorla */
body.ss327-sade [class*="footer"] .row,
body.ss327-sade footer .row{
    max-width:100% !important;
}

/* Footer üst görsel/daire alanı geniş kutuya göre ortalı kalsın */
body.ss327-sade .footer-avatar,
body.ss327-sade .footer-circle,
body.ss327-sade .sade-footer-avatar,
body.ss327-sade .sade-footer-circle,
body.ss327-sade [class*="footer"] [class*="circle"],
body.ss327-sade [class*="footer"] [class*="avatar"]{
    margin-left:auto !important;
    margin-right:auto !important;
}

/* Footer butonları taşma yapmasın */
body.ss327-sade footer a,
body.ss327-sade .footer a,
body.ss327-sade .site-footer a,
body.ss327-sade .ss327-footer a,
body.ss327-sade .sade-footer a{
    max-width:100% !important;
    box-sizing:border-box !important;
}

/* Orta ekranlarda aynı hizayı koru */
@media(max-width:1200px){
    body.ss327-sade{
        --ss-page-gutter: 24px;
    }
}

/* Mobilde footer çok kenara yapışmasın */
@media(max-width:768px){
    body.ss327-sade{
        --ss-page-gutter: 14px;
    }

    body.ss327-sade footer > .container,
    body.ss327-sade footer .container,
    body.ss327-sade .footer > .container,
    body.ss327-sade .footer .container,
    body.ss327-sade .site-footer > .container,
    body.ss327-sade .site-footer .container,
    body.ss327-sade .ss327-footer > .container,
    body.ss327-sade .ss327-footer .container,
    body.ss327-sade .sade-footer > .container,
    body.ss327-sade .sade-footer .container{
        width:calc(100% - (var(--ss-page-gutter) * 2)) !important;
    }
}


/* ==================================================
   Sayfalar + Tema Renkleri DB Köprüsü
   pages tablosu ve active_theme_id teması ana görünüme uygulanır.
================================================== */

body.ss327-sade{
    background:var(--ss-theme-bg,#eef2ff)!important;
    color:var(--ss-theme-text,#14205c)!important;
}

body.ss327-sade .ss327-header,
body.ss327-sade .sade-quick-actions,
body.ss327-sade .sade-live-map-lite,
body.ss327-sade footer{
    background:
        radial-gradient(circle at 15% 0%, rgba(var(--ss-theme-primary-rgb,64,84,191),.12), transparent 34%),
        linear-gradient(180deg,var(--ss-theme-bg,#eef2ff),var(--ss-theme-bg,#eef2ff))!important;
    color:var(--ss-theme-text,#14205c)!important;
}

body.ss327-sade .ss327-navbox,
body.ss327-sade .sade-action-card,
body.ss327-sade .sade-live-map-shell,
body.ss327-sade .ss327-side-card,
body.ss327-sade .foara,
body.ss327-sade .ss327-page-card{
    background:var(--ss-theme-card,#fff)!important;
    color:var(--ss-theme-text,#14205c)!important;
    border-color:var(--ss-theme-border,rgba(64,84,191,.22))!important;
}

body.ss327-sade .ss327-logo,
body.ss327-sade .ss327-menu .nav-link,
body.ss327-sade .ss327-page-card,
body.ss327-sade .ss327-page-card h1,
body.ss327-sade .ss327-page-card h2,
body.ss327-sade .ss327-page-card h3,
body.ss327-sade .ss327-page-card p,
body.ss327-sade .ss327-page-card li{
    color:var(--ss-theme-text,#14205c)!important;
}

body.ss327-sade .ss327-menu .nav-link:hover,
body.ss327-sade .ss327-menu .nav-link.active,
body.ss327-sade .ss327-page-card a{
    color:var(--ss-theme-secondary,#24adff)!important;
}

body.ss327-sade .sade-action-icon,
body.ss327-sade .ss327-page-kicker,
body.ss327-sade .btn-primary{
    background:linear-gradient(135deg,var(--ss-theme-primary,#4054bf),var(--ss-theme-secondary,#24adff))!important;
    color:#fff!important;
}

body.ss327-sade .sade-action-card::after,
body.ss327-sade .ss327-page-card::before{
    background:linear-gradient(90deg,var(--ss-theme-secondary,#24adff),var(--ss-theme-primary,#4054bf),var(--ss-theme-accent,#e91e63))!important;
}

body.ss327-sade .ss327-page-main{
    max-width:1340px;
    margin:0 auto;
    padding:34px 28px 70px;
}

body.ss327-sade .ss327-page-card{
    position:relative;
    overflow:hidden;
    border:1px solid var(--ss-theme-border,rgba(64,84,191,.22));
    border-radius:28px;
    padding:38px;
    box-shadow:0 22px 70px rgba(0,0,0,.10);
}

body.ss327-sade .ss327-page-card::before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:4px;
}

body.ss327-sade .ss327-page-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 13px;
    border-radius:999px;
    font-size:12px;
    font-weight:900;
    margin-bottom:16px;
}

body.ss327-sade .ss327-page-title{
    margin:0 0 20px;
    font-size:clamp(28px,4vw,44px);
    font-weight:950;
    letter-spacing:-.04em;
}

body.ss327-sade .ss327-page-content{
    font-size:16px;
    line-height:1.82;
}

body.ss327-sade .ss327-page-content h1,
body.ss327-sade .ss327-page-content h2,
body.ss327-sade .ss327-page-content h3{
    margin:24px 0 12px;
    font-weight:950;
}

body.ss327-sade .ss327-page-content p{
    margin:0 0 16px;
}

body.ss327-sade .ss327-page-content ul{
    margin:0 0 18px 20px;
    padding:0;
}

@media(max-width:768px){
    body.ss327-sade .ss327-page-main{
        padding:22px 14px 46px;
    }
    body.ss327-sade .ss327-page-card{
        padding:24px 18px;
        border-radius:22px;
    }
}


/* ==================================================
   FINAL: Ortak sayfa sistemi - index.php kalıbıyla uyum
================================================== */
body.ss327-sade .ss327-page-main{
    max-width:1340px;
    margin:0 auto;
    padding:38px 0 76px;
}
body.ss327-sade .ss327-page-card{
    position:relative;
    overflow:hidden;
    background:var(--ss-theme-card,#fff)!important;
    color:var(--ss-theme-text,#14205c)!important;
    border:1px solid var(--ss-theme-border,rgba(64,84,191,.22))!important;
    border-radius:28px;
    padding:38px;
    box-shadow:0 22px 70px rgba(0,0,0,.10);
}
body.ss327-sade .ss327-page-card:before{
    content:"";
    position:absolute;
    left:0;
    right:0;
    top:0;
    height:4px;
    background:linear-gradient(90deg,var(--ss-theme-secondary,#24adff),var(--ss-theme-primary,#4054bf),var(--ss-theme-accent,#e91e63));
}
body.ss327-sade .ss327-page-kicker{
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:34px;
    padding:0 13px;
    margin-bottom:16px;
    border-radius:999px;
    background:linear-gradient(135deg,var(--ss-theme-primary,#4054bf),var(--ss-theme-secondary,#24adff));
    color:#fff!important;
    font-size:12px;
    font-weight:900;
}
body.ss327-sade .ss327-page-title{
    margin:0 0 22px;
    color:var(--ss-theme-text,#14205c)!important;
    font-size:clamp(30px,4vw,46px);
    line-height:1.08;
    letter-spacing:-.04em;
    font-weight:950;
}
body.ss327-sade .ss327-page-content{
    color:var(--ss-theme-text,#14205c)!important;
    font-size:16px;
    line-height:1.84;
}
body.ss327-sade .ss327-page-content h1,
body.ss327-sade .ss327-page-content h2,
body.ss327-sade .ss327-page-content h3,
body.ss327-sade .ss327-page-content p,
body.ss327-sade .ss327-page-content li{
    color:var(--ss-theme-text,#14205c)!important;
}
body.ss327-sade .ss327-page-content p{margin:0 0 16px;}
@media(max-width:768px){
    body.ss327-sade .ss327-page-main{padding:24px 0 54px;}
    body.ss327-sade .ss327-page-card{padding:24px 18px;border-radius:22px;}
}


/* ==================================================
   Trend Yazılar / Çok Okunanlar Kayma Düzeltmesi
   Sidebar içindeki başlık, resim ve sıra numarası kutu dışına taşmasın.
================================================== */

body.ss327-sade .ss335-side-card,
body.ss327-sade .ss335-pop-list,
body.ss327-sade .ss335-pop-list *{
    box-sizing:border-box !important;
}

body.ss327-sade .ss335-side-card{
    max-width:100% !important;
    overflow:hidden !important;
}

body.ss327-sade .ss335-pop-list{
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
    padding:12px !important;
}

body.ss327-sade .ss335-pop-list a{
    display:grid !important;
    grid-template-columns:32px 54px minmax(0,1fr) !important;
    gap:10px !important;
    align-items:center !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    overflow:hidden !important;
    padding:8px !important;
}

body.ss327-sade .ss335-pop-list .rank{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    flex:0 0 32px !important;
}

body.ss327-sade .ss335-pop-list .thumb{
    width:54px !important;
    height:44px !important;
    min-width:54px !important;
    max-width:54px !important;
    overflow:hidden !important;
}

body.ss327-sade .ss335-pop-list .thumb img{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

body.ss327-sade .ss335-pop-list .txt{
    min-width:0 !important;
    width:100% !important;
    max-width:100% !important;
    overflow:hidden !important;
}

body.ss327-sade .ss335-pop-list .txt b{
    display:-webkit-box !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    line-clamp:2 !important;
    white-space:normal !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    max-width:100% !important;
    line-height:1.25 !important;
    font-size:12px !important;
    word-break:normal !important;
    overflow-wrap:anywhere !important;
}

body.ss327-sade .ss335-pop-list .txt small{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    margin-top:4px !important;
}

@media(max-width:1200px){
    body.ss327-sade .ss335-pop-list a{
        grid-template-columns:30px 48px minmax(0,1fr) !important;
        gap:8px !important;
    }

    body.ss327-sade .ss335-pop-list .rank{
        width:30px !important;
        height:30px !important;
        min-width:30px !important;
    }

    body.ss327-sade .ss335-pop-list .thumb{
        width:48px !important;
        height:40px !important;
        min-width:48px !important;
        max-width:48px !important;
    }
}


/* ==================================================
   GÖRÜNÜM KESİN V4
   Trend Yazılar / Çok Okunanlar / Popüler Yazılar taşma düzeltmesi
   Bu blok geniş seçici kullanır; sınıf adı farklı olsa bile sidebar listelerini toparlar.
================================================== */

:root{
    --ss-trend-rank-w:42px;
    --ss-trend-thumb-w:68px;
    --ss-trend-gap:12px;
}

body.ss327-sade .ss327-sidebar,
body.ss327-sade .ss327-sidebar *,
body.ss327-sade .ss327-side-card,
body.ss327-sade .ss327-side-card *,
body.ss327-sade .ss335-side-card,
body.ss327-sade .ss335-side-card *,
body.ss327-sade [class*="trend"],
body.ss327-sade [class*="trend"] *,
body.ss327-sade [class*="popular"],
body.ss327-sade [class*="popular"] *,
body.ss327-sade [class*="populer"],
body.ss327-sade [class*="populer"] *,
body.ss327-sade [class*="okunan"],
body.ss327-sade [class*="okunan"] *{
    box-sizing:border-box!important;
}

body.ss327-sade .ss327-sidebar,
body.ss327-sade .ss327-side-card,
body.ss327-sade .ss335-side-card,
body.ss327-sade [class*="trend"],
body.ss327-sade [class*="popular"],
body.ss327-sade [class*="populer"],
body.ss327-sade [class*="okunan"]{
    max-width:100%!important;
    overflow:hidden!important;
}

body.ss327-sade .ss327-side-card a,
body.ss327-sade .ss335-pop-list a,
body.ss327-sade .ss327-mini-post,
body.ss327-sade [class*="trend"] a,
body.ss327-sade [class*="popular"] a,
body.ss327-sade [class*="populer"] a,
body.ss327-sade [class*="okunan"] a{
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
}

/* Görsel + sıra no + yazı satırı olan kartları grid'e zorla */
body.ss327-sade .ss335-pop-list a,
body.ss327-sade .trend-list a,
body.ss327-sade .popular-list a,
body.ss327-sade .populer-list a,
body.ss327-sade .cok-okunanlar a,
body.ss327-sade .ss327-side-card .post-item,
body.ss327-sade .ss327-side-card .popular-item,
body.ss327-sade .ss327-side-card .trend-item,
body.ss327-sade .ss327-side-card .ss335-pop-item{
    display:grid!important;
    grid-template-columns:var(--ss-trend-rank-w) var(--ss-trend-thumb-w) minmax(0,1fr)!important;
    gap:var(--ss-trend-gap)!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
}

/* Eğer link içinde direkt span/img/b gibi yapı varsa da bozulmasın */
body.ss327-sade .ss335-pop-list a > *:last-child,
body.ss327-sade .trend-list a > *:last-child,
body.ss327-sade .popular-list a > *:last-child,
body.ss327-sade .populer-list a > *:last-child,
body.ss327-sade .cok-okunanlar a > *:last-child,
body.ss327-sade .ss327-side-card .post-item > *:last-child,
body.ss327-sade .ss327-side-card .popular-item > *:last-child,
body.ss327-sade .ss327-side-card .trend-item > *:last-child{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
}

/* Sıra numarası */
body.ss327-sade .rank,
body.ss327-sade .sira,
body.ss327-sade .order,
body.ss327-sade .number,
body.ss327-sade .ss335-pop-list i:first-child,
body.ss327-sade .ss327-mini-post i:first-child,
body.ss327-sade [class*="trend"] i:first-child,
body.ss327-sade [class*="popular"] i:first-child,
body.ss327-sade [class*="populer"] i:first-child{
    width:var(--ss-trend-rank-w)!important;
    height:38px!important;
    min-width:var(--ss-trend-rank-w)!important;
    max-width:var(--ss-trend-rank-w)!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 var(--ss-trend-rank-w)!important;
    overflow:hidden!important;
}

/* Küçük görsel */
body.ss327-sade .thumb,
body.ss327-sade .thumbnail,
body.ss327-sade .post-thumb,
body.ss327-sade .ss335-pop-list img,
body.ss327-sade .ss327-side-card a img,
body.ss327-sade [class*="trend"] img,
body.ss327-sade [class*="popular"] img,
body.ss327-sade [class*="populer"] img,
body.ss327-sade [class*="okunan"] img{
    width:var(--ss-trend-thumb-w)!important;
    height:52px!important;
    min-width:var(--ss-trend-thumb-w)!important;
    max-width:var(--ss-trend-thumb-w)!important;
    object-fit:cover!important;
    display:block!important;
    overflow:hidden!important;
    flex:0 0 var(--ss-trend-thumb-w)!important;
}

/* Yazı taşımasını bitir */
body.ss327-sade .txt,
body.ss327-sade .title,
body.ss327-sade .post-title,
body.ss327-sade .item-title,
body.ss327-sade .ss335-pop-list .txt,
body.ss327-sade .ss327-side-card .txt,
body.ss327-sade [class*="trend"] .txt,
body.ss327-sade [class*="popular"] .txt,
body.ss327-sade [class*="populer"] .txt,
body.ss327-sade [class*="okunan"] .txt{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
}

/* Başlıklar: iki satır, kutu dışına taşma yok */
body.ss327-sade .ss335-pop-list b,
body.ss327-sade .ss327-side-card a b,
body.ss327-sade .ss327-side-card a span,
body.ss327-sade [class*="trend"] a b,
body.ss327-sade [class*="trend"] a span,
body.ss327-sade [class*="popular"] a b,
body.ss327-sade [class*="popular"] a span,
body.ss327-sade [class*="populer"] a b,
body.ss327-sade [class*="populer"] a span,
body.ss327-sade [class*="okunan"] a b,
body.ss327-sade [class*="okunan"] a span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
}

/* Sadece başlık gibi duran kalın metinleri iki satır yap */
body.ss327-sade .ss335-pop-list b,
body.ss327-sade [class*="trend"] a b,
body.ss327-sade [class*="popular"] a b,
body.ss327-sade [class*="populer"] a b,
body.ss327-sade [class*="okunan"] a b{
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    line-clamp:2!important;
    line-height:1.25!important;
}

/* Okunma / küçük bilgi alanı */
body.ss327-sade .ss335-pop-list small,
body.ss327-sade .ss327-side-card small,
body.ss327-sade [class*="trend"] small,
body.ss327-sade [class*="popular"] small,
body.ss327-sade [class*="populer"] small,
body.ss327-sade [class*="okunan"] small{
    display:block!important;
    max-width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

/* Eğer kart içi genişlik çok darsa 3 kolon 2 kolona düşsün */
@media(max-width:1280px){
    :root{
        --ss-trend-rank-w:38px;
        --ss-trend-thumb-w:60px;
        --ss-trend-gap:10px;
    }
}

@media(max-width:420px){
    :root{
        --ss-trend-rank-w:34px;
        --ss-trend-thumb-w:54px;
        --ss-trend-gap:8px;
    }
}

/* Sayfa hero/harita zorunlu paketinin görünür aralığı */
body.ss327-sade .ss-page-forced-hero{
    display:block!important;
    margin-top:0!important;
}

body.ss327-sade .ss-page-forced-map{
    display:block!important;
}


/* ==================================================
   SOHBET TEMA GÖVDE KÖPRÜSÜ
   Admin > Tema Ayarları renklerini dış gövdeye taşır.
   Ana renk: --ss-theme-primary
   Arkaplan: --ss-theme-bg
   Metin: --ss-theme-text
================================================== */

body.ss327-sade{
    background:
        radial-gradient(circle at 12% 0%, var(--ss-theme-soft,rgba(64,84,191,.10)), transparent 34%),
        radial-gradient(circle at 88% 8%, var(--ss-theme-soft-2,rgba(36,173,255,.13)), transparent 36%),
        var(--ss-theme-bg,#EEF2FF)!important;
    color:var(--ss-theme-text,#14205C)!important;
}

body.ss327-sade .ss327-header,
body.ss327-sade .sade-quick-actions,
body.ss327-sade .sade-live-map-lite,
body.ss327-sade .ss327-page-main,
body.ss327-sade .ss331-blogx-wrap,
body.ss327-sade footer{
    background:transparent!important;
    color:var(--ss-theme-text,#14205C)!important;
}

body.ss327-sade .ss327-navbox,
body.ss327-sade .uvea,
body.ss327-sade .ss331-blogx-nav,
body.ss327-sade .ss331-blogx-navbox,
body.ss327-sade .ss-page-nav{
    background:var(--ss-theme-header,#fff)!important;
    border-color:var(--ss-theme-border,rgba(64,84,191,.24))!important;
    color:var(--ss-theme-text,#14205C)!important;
}

body.ss327-sade .sade-quick-card,
body.ss327-sade .sade-live-map-shell,
body.ss327-sade .ss327-page-card,
body.ss327-sade .ss327-side-card,
body.ss327-sade .ss331-blogx-side-card,
body.ss327-sade .ss331-blogx-post-card,
body.ss327-sade .smallarka,
body.ss327-sade .makust,
body.ss327-sade .katsab,
body.ss327-sade .popsab,
body.ss327-sade .onerilensab,
body.ss327-sade .yorumsab,
body.ss327-sade .ss327-footer-box,
body.ss327-sade .card{
    background:var(--ss-theme-card,#fff)!important;
    border-color:var(--ss-theme-border,rgba(64,84,191,.24))!important;
    color:var(--ss-theme-text,#14205C)!important;
}

body.ss327-sade .sade-quick-card-icon,
body.ss327-sade .ss327-page-kicker,
body.ss327-sade .ss331-blogx-kicker,
body.ss327-sade .ss331-blogx-cat,
body.ss327-sade .devami,
body.ss327-sade .btn-primary-custom{
    background:var(--ss-theme-gradient,linear-gradient(135deg,#4054BF,#24ADFF))!important;
    color:#fff!important;
}

body.ss327-sade h1,
body.ss327-sade h2,
body.ss327-sade h3,
body.ss327-sade h4,
body.ss327-sade h5,
body.ss327-sade h6,
body.ss327-sade .ss327-logo,
body.ss327-sade .navbar-brand,
body.ss327-sade .ss327-menu .nav-link,
body.ss327-sade .ss327-page-title,
body.ss327-sade .ss331-blogx-title,
body.ss327-sade .ss331-blogx-pop-title{
    color:var(--ss-theme-text,#14205C)!important;
}

body.ss327-sade .ss327-menu .nav-link.active,
body.ss327-sade .ss327-menu .nav-link:hover{
    background:var(--ss-theme-gradient,linear-gradient(135deg,#4054BF,#24ADFF))!important;
    color:#fff!important;
}

body.ss327-sade .bg-white,
body.ss327-sade .bg-light,
body.ss327-sade .white-bg{
    background:var(--ss-theme-card,#fff)!important;
}