:root {
    color-scheme: light;
    --arkaplan: #f8faf9;
    --yuzey: #ffffff;
    --yuzey-2: #f1f5f3;
    --metin: #202825;
    --metin-soluk: #66716c;
    --header-arkaplan: rgba(250, 252, 251, 0.94);
    --border: #dfe8e3;
    --border-guclu: #c9d8d1;
    --pastel-yesil: #b9dfcf;
    --pastel-mavi: #b9d8ed;
    --pastel-turuncu: #f4c996;
    --vurgu: #78b7df;
    --vurgu-guclu: #307fae;
    --basari: #4b8d72;
    --uyari: #c2763c;
    --tehlike: #ba5959;
    --golge: 0 18px 44px rgba(40, 63, 52, 0.09);
    --golge-kucuk: 0 6px 18px rgba(40, 63, 52, 0.08);
    --odak: 0 0 0 3px rgba(48, 127, 174, 0.24);
    --header-yukseklik: 64px;
    --logo-yesil: #18e0be;
    --sekme-aktif: #16c89d;
    --header-govde-genislik: 1500px;
}

[data-theme="dark"] {
    color-scheme: dark;
    --arkaplan: #171c28;
    --yuzey: #202735;
    --yuzey-2: #252e3d;
    --metin: #e7ecea;
    --metin-soluk: #a8b3af;
    --header-arkaplan: rgba(23, 28, 40, 0.94);
    --border: #343e50;
    --border-guclu: #455167;
    --pastel-yesil: #497461;
    --pastel-mavi: #466f8c;
    --pastel-turuncu: #956b42;
    --vurgu: #6ba9d0;
    --vurgu-guclu: #9bcce9;
    --basari: #74b89b;
    --uyari: #e0a167;
    --tehlike: #e08484;
    --golge: 0 20px 50px rgba(0, 0, 0, 0.26);
    --golge-kucuk: 0 7px 20px rgba(0, 0, 0, 0.22);
    --odak: 0 0 0 3px rgba(107, 169, 208, 0.28);
    --logo-yesil: #18e0be;
    --sekme-aktif: #2fd8af;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    min-width: 320px;
    background: var(--arkaplan);
    scroll-behavior: smooth;
}

body {
    display: flex;
    min-height: 100vh;
    flex-direction: column;
    margin: 0;
    background:
        radial-gradient(circle at 12% 0%, rgba(185, 223, 207, 0.18), transparent 28rem),
        radial-gradient(circle at 88% 2%, rgba(185, 216, 237, 0.16), transparent 30rem),
        var(--arkaplan);
    color: var(--metin);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.5;
    transition: background-color 180ms ease, color 180ms ease;
}

button,
input,
select,
textarea {
    color: inherit;
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: none;
    box-shadow: var(--odak);
}

button:disabled {
    cursor: not-allowed;
    opacity: 0.55;
}

.ekrana-atla {
    position: fixed;
    top: 8px;
    left: 8px;
    z-index: 5000;
    padding: 8px 12px;
    border-radius: 8px;
    background: var(--metin);
    color: var(--arkaplan);
    text-decoration: none;
    transform: translateY(-140%);
}

.ekrana-atla:focus {
    transform: translateY(0);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 1000;
    width: 100%;
    border-bottom: 1px solid var(--border);
    background: var(--header-arkaplan);
    box-shadow: 0 4px 18px rgba(21, 35, 29, 0.05);
    backdrop-filter: blur(14px);
}

.site-header-icerik {
    display: flex;
    width: max-content;
    max-width: 100%;
    min-height: var(--header-yukseklik);
    align-items: center;
    justify-content: center;
    gap: 7px;
    margin: 0 auto;
    padding: 6px max(14px, env(safe-area-inset-right)) 6px max(14px, env(safe-area-inset-left));
}

.site-logo {
    display: inline-flex;
    flex: 0 0 auto;
    width: fit-content;
    align-items: center;
    margin-right: 18px;
    border-radius: 8px;
}

.site-logo img {
    display: block;
    width: auto;
    height: 40px;
    object-fit: contain;
}

.site-nav {
    display: flex;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
    align-items: center;
    justify-content: center;
    gap: 2px;
    overflow-x: auto;
    scrollbar-width: none;
}

.site-nav::-webkit-scrollbar {
    display: none;
}

.sekme-btn {
    position: relative;
    display: inline-flex;
    flex: 0 0 auto;
    min-height: 32px;
    align-items: center;
    justify-content: center;
    padding: 5px 9px 7px;
    border: 0;
    border-radius: 9px;
    background: transparent;
    color: var(--metin-soluk);
    cursor: pointer;
    font-size: 0.82rem;
    font-weight: 650;
    letter-spacing: -0.015em;
    text-transform: lowercase;
    transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.sekme-btn::after {
    content: '';
    position: absolute;
    right: 7px;
    bottom: 1px;
    left: 7px;
    height: 2px;
    border-radius: 999px;
    background: var(--sekme-aktif);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 180ms ease;
}

.sekme-btn:hover {
    background: color-mix(in srgb, var(--yuzey-2) 76%, transparent);
    color: var(--metin);
}

.sekme-btn:active {
    transform: translateY(1px);
}

.sekme-btn.aktif {
    color: var(--metin);
}

.sekme-btn.aktif::after {
    transform: scaleX(1);
}

.sekme-btn--uye {
    width: 37px;
    min-width: 37px;
    padding-right: 6px;
    padding-left: 6px;
}

.sekme-btn-ikon {
    display: inline-flex;
    width: 22px;
    height: 22px;
    align-items: center;
    justify-content: center;
    color: var(--logo-yesil);
}

.sekme-btn-ikon svg,
.tema-ikon svg {
    display: block;
    width: 100%;
    height: 100%;
}

.yalniz-ekran-okuyucu {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.tema-btn {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    width: 29px;
    height: 29px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: var(--yuzey);
    color: var(--metin-soluk);
    box-shadow: var(--golge-kucuk);
    cursor: pointer;
    transition: transform 160ms ease, color 160ms ease, background-color 160ms ease, border-color 160ms ease;
}

.tema-btn:hover {
    transform: rotate(8deg);
    border-color: color-mix(in srgb, var(--sekme-aktif) 42%, var(--border));
    background: var(--yuzey-2);
    color: var(--metin);
}

.tema-ikon {
    position: absolute;
    display: inline-flex;
    width: 15px;
    height: 15px;
    align-items: center;
    justify-content: center;
    transition: opacity 160ms ease, transform 180ms ease;
}

.tema-ikon--gunes {
    opacity: 0;
    transform: scale(0.65) rotate(-30deg);
}

[data-theme="dark"] .tema-ikon--ay {
    opacity: 0;
    transform: scale(0.65) rotate(30deg);
}

[data-theme="dark"] .tema-ikon--gunes {
    opacity: 1;
    transform: scale(1) rotate(0);
}

.site-main {
    flex: 1 0 auto;
    width: min(100%, 1500px);
    min-height: calc(100vh - var(--header-yukseklik));
    margin: 0 auto;
    padding: clamp(20px, 3vw, 42px) clamp(14px, 3vw, 40px) 56px;
}

.site-main:focus {
    outline: none;
}

.modul-baslik {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

.modul-baslik h1,
.modul-baslik h2,
.modul-baslik p {
    margin: 0;
}

.modul-baslik h1,
.modul-baslik h2 {
    font-size: clamp(1.6rem, 3vw, 2.4rem);
    line-height: 1.1;
    letter-spacing: -0.04em;
}

.modul-baslik p {
    max-width: 690px;
    margin-top: 8px;
    color: var(--metin-soluk);
}

.kart {
    border: 1px solid var(--border);
    border-radius: 18px;
    background: var(--yuzey);
    box-shadow: var(--golge-kucuk);
}

.etiket {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 4px 9px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--yuzey-2);
    color: var(--metin-soluk);
    font-size: 0.75rem;
    font-weight: 700;
    letter-spacing: 0.02em;
}

.birincil-btn,
.ikincil-btn,
.tehlike-btn {
    display: inline-flex;
    min-height: 38px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 8px 13px;
    border: 1px solid transparent;
    border-radius: 10px;
    cursor: pointer;
    font-size: 0.86rem;
    font-weight: 750;
    line-height: 1;
    transition: transform 140ms ease, filter 140ms ease, background-color 140ms ease, border-color 140ms ease;
}

.birincil-btn {
    border-color: color-mix(in srgb, var(--vurgu) 75%, var(--border));
    background: var(--pastel-mavi);
    color: #142532;
}

.ikincil-btn {
    border-color: var(--border);
    background: var(--yuzey);
    color: var(--metin);
}

.tehlike-btn {
    border-color: color-mix(in srgb, var(--tehlike) 50%, var(--border));
    background: color-mix(in srgb, var(--tehlike) 12%, var(--yuzey));
    color: var(--tehlike);
}

.birincil-btn:hover,
.ikincil-btn:hover,
.tehlike-btn:hover {
    filter: brightness(1.03);
    transform: translateY(-1px);
}

.yukleniyor {
    display: grid;
    min-height: 240px;
    place-items: center;
    color: var(--metin-soluk);
}

.yukleniyor-icerik {
    display: grid;
    justify-items: center;
    gap: 12px;
}

.yukleniyor-nokta {
    width: 38px;
    height: 38px;
    border: 3px solid var(--border);
    border-top-color: var(--vurgu);
    border-radius: 50%;
    animation: don 750ms linear infinite;
}

.modul-hata {
    max-width: 640px;
    margin: 48px auto;
    padding: 28px;
    text-align: center;
}

.modul-hata h2,
.modul-hata p {
    margin: 0;
}

.modul-hata p {
    margin: 9px 0 18px;
    color: var(--metin-soluk);
}


.site-footer {
    flex: 0 0 auto;
    border-top: 1px solid var(--border);
    background:
        linear-gradient(180deg, color-mix(in srgb, var(--yuzey) 88%, transparent), var(--yuzey));
}

.site-footer-icerik {
    display: grid;
    grid-template-columns: minmax(220px, 0.9fr) minmax(340px, 1.1fr);
    width: min(100%, 1180px);
    gap: clamp(28px, 6vw, 86px);
    margin: 0 auto;
    padding: 34px clamp(16px, 3vw, 34px) 28px;
}

.footer-marka {
    align-self: start;
}

.footer-logo {
    display: block;
    width: auto;
    height: 34px;
}

.footer-marka p {
    margin: 11px 0 0;
    color: var(--metin-soluk);
    font-size: 0.82rem;
}

.footer-harita {
    display: grid;
    grid-template-columns: repeat(2, minmax(140px, 1fr));
    gap: 30px;
}

.footer-harita > div {
    display: grid;
    align-content: start;
    gap: 7px;
}

.footer-harita h2 {
    margin: 0 0 4px;
    color: var(--metin);
    font-size: 0.76rem;
    font-weight: 850;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

.footer-harita a {
    width: fit-content;
    color: var(--metin-soluk);
    font-size: 0.81rem;
    text-decoration: none;
    text-underline-offset: 3px;
    transition: color 140ms ease, transform 140ms ease;
}

.footer-harita a:hover {
    color: var(--sekme-aktif);
    transform: translateX(2px);
}

.footer-alt {
    display: flex;
    width: min(100%, 1180px);
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin: 0 auto;
    padding: 13px 16px calc(13px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--border);
    color: var(--metin-soluk);
    font-size: 0.72rem;
    letter-spacing: 0.02em;
}


.noscript-uyari {
    margin: 30px;
    padding: 18px;
    border: 1px solid var(--tehlike);
    border-radius: 12px;
    background: var(--yuzey);
    color: var(--tehlike);
}

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

@media (max-width: 720px) {
    .site-header-icerik {
        display: grid;
        grid-template-columns: auto auto;
        width: 100%;
        justify-content: center;
        column-gap: 9px;
        row-gap: 2px;
        padding-top: 5px;
        padding-bottom: 6px;
    }

    .site-logo {
        grid-column: 1;
        grid-row: 1;
        justify-self: end;
        margin-right: 8px;
    }

    .site-logo img {
        height: 35px;
    }

    .tema-btn {
        grid-column: 2;
        grid-row: 1;
        justify-self: start;
        width: 27px;
        height: 27px;
    }

    .site-nav {
        grid-column: 1 / -1;
        grid-row: 2;
        justify-self: center;
        flex-wrap: wrap;
        justify-content: center;
        gap: 1px;
        overflow: visible;
    }

    .site-main {
        padding-top: 24px;
    }
}

@media (max-width: 720px) {
    .site-footer-icerik {
        grid-template-columns: 1fr;
        gap: 25px;
        padding-top: 28px;
    }

    .footer-harita {
        gap: 22px;
    }
}

@media (max-width: 600px) {
    .modul-baslik {
        align-items: flex-start;
        flex-direction: column;
        gap: 10px;
    }

    .site-header-icerik {
        padding-right: 8px;
        padding-left: 8px;
    }

    .sekme-btn {
        min-height: 29px;
        padding: 4px 7px 6px;
        font-size: 0.76rem;
    }

    .sekme-btn--uye {
        width: 34px;
        min-width: 34px;
        padding-right: 5px;
        padding-left: 5px;
    }

    .sekme-btn-ikon {
        width: 20px;
        height: 20px;
    }

    .footer-harita {
        grid-template-columns: 1fr 1fr;
        gap: 16px;
    }

    .footer-logo {
        height: 31px;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}

/* --------------------------------------------------------------------------
   Yazkenara 2.02 · kurumsal ana menü
   -------------------------------------------------------------------------- */
.site-nav {
    flex-wrap: nowrap;
    gap: 0;
    white-space: nowrap;
}

.sekme-btn:not(.sekme-btn--uye) + .sekme-btn:not(.sekme-btn--uye)::before {
    content: '';
    position: absolute;
    top: 50%;
    left: -1px;
    width: 1px;
    height: 18px;
    border-radius: 999px;
    background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--sekme-aktif) 62%, var(--border-guclu)), transparent);
    transform: translateY(-50%);
    pointer-events: none;
}

.sekme-btn .sekme-ilk-harf {
    color: inherit;
    font-size: inherit;
    font-weight: 900;
    line-height: inherit;
    text-shadow: none;
    transition: color 160ms ease, filter 160ms ease, text-shadow 160ms ease;
}

.sekme-btn:hover,
.sekme-btn:focus-visible {
    color: var(--metin);
    text-shadow: 0 0 10px color-mix(in srgb, var(--sekme-aktif) 34%, transparent);
}

.sekme-btn:hover .sekme-ilk-harf,
.sekme-btn:focus-visible .sekme-ilk-harf,
.sekme-btn.aktif .sekme-ilk-harf {
    filter: none;
    text-shadow: none;
}

.sekme-btn--uye:hover .sekme-btn-ikon,
.sekme-btn--uye:focus-visible .sekme-btn-ikon,
.sekme-btn--uye.aktif .sekme-btn-ikon,
.tema-btn:hover .tema-ikon,
.tema-btn:focus-visible .tema-ikon {
    filter: drop-shadow(0 0 4px color-mix(in srgb, var(--logo-yesil) 94%, transparent)) drop-shadow(0 0 10px color-mix(in srgb, var(--logo-yesil) 62%, transparent));
}

@media (max-width: 720px) {
    .site-nav {
        width: min(100vw - 16px, max-content);
        max-width: calc(100vw - 16px);
        flex-wrap: nowrap;
        justify-content: flex-start;
        overflow-x: auto;
        overflow-y: hidden;
    }
}

/* --------------------------------------------------------------------------
   Yazkenara 2.04 · ortak site durumu ve başlık dengesi
   -------------------------------------------------------------------------- */
.site-bildirimler {
    display: grid;
    width: min(100% - 24px, 960px);
    gap: 7px;
    margin: 12px auto 0;
}

.site-bildirim {
    display: flex;
    min-height: 42px;
    align-items: center;
    gap: 10px;
    padding: 9px 13px;
    border: 1px solid color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 35%, var(--border));
    border-radius: 10px;
    background: color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 7%, var(--yuzey));
    box-shadow: var(--golge-kucuk);
    color: var(--metin);
}

.site-bildirim p {
    margin: 0;
    font-size: 0.88rem;
    line-height: 1.42;
}

.site-bildirim-isaret {
    width: 8px;
    height: 8px;
    flex: 0 0 auto;
    border-radius: 50%;
    background: var(--bildirim-rengi, var(--vurgu));
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 14%, transparent);
}

.site-bildirim--info { --bildirim-rengi: var(--vurgu); }
.site-bildirim--success { --bildirim-rengi: var(--basari); }
.site-bildirim--warning { --bildirim-rengi: var(--uyari); }
.site-bildirim--critical { --bildirim-rengi: var(--tehlike); }

.site-bakim-modu {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 24px;
}

.site-bakim {
    width: min(100%, 620px);
}

.site-bakim-karti {
    display: grid;
    justify-items: center;
    gap: 12px;
    padding: clamp(28px, 7vw, 58px);
    border: 1px solid var(--border);
    border-radius: 18px;
    background: color-mix(in srgb, var(--yuzey) 94%, transparent);
    box-shadow: var(--golge);
    text-align: center;
    backdrop-filter: blur(16px);
}

.site-bakim-karti img {
    width: min(230px, 72vw);
    height: auto;
    margin-bottom: 8px;
}

.site-bakim-etiket {
    color: var(--basari);
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.site-bakim-karti h1 {
    margin: 0;
    font-size: clamp(1.55rem, 5vw, 2.35rem);
    line-height: 1.12;
}

.site-bakim-karti p {
    max-width: 48ch;
    margin: 0;
    color: var(--metin-soluk);
    font-size: 1rem;
}

.site-bakim-karti small {
    margin-top: 9px;
    color: var(--metin-soluk);
    font-size: 0.72rem;
    letter-spacing: 0.08em;
}

@media (max-width: 640px) {
    .site-bildirimler {
        width: calc(100% - 16px);
        margin-top: 8px;
    }

    .site-bildirim {
        align-items: flex-start;
        padding: 9px 11px;
    }

    .site-bildirim-isaret {
        margin-top: 5px;
    }
}

/* Yazkenara 2.05 · doğrulanmış kullanıcı durumu */
.sekme-btn--uye.oturum-acik::before {
    content: '';
    position: absolute;
    top: 4px;
    right: 4px;
    z-index: 2;
    width: 7px;
    height: 7px;
    border: 2px solid var(--header-arkaplan);
    border-radius: 50%;
    background: var(--sekme-aktif);
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--sekme-aktif) 18%, transparent);
}

/* Yazkenara 2.11 · zamanlanmış duyuru ve pop-up yüzeyleri */
.site-bildirim-metin {
    display: grid;
    min-width: 0;
    flex: 1 1 auto;
    gap: 2px;
}

.site-bildirim-metin strong {
    font-size: .78rem;
    line-height: 1.25;
}

.site-bildirim-eylem,
.site-popup-eylem {
    display: inline-flex;
    min-height: 31px;
    align-items: center;
    justify-content: center;
    padding: 6px 10px;
    border: 1px solid color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 42%, var(--border));
    border-radius: 8px;
    background: color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 12%, var(--yuzey));
    color: var(--metin);
    font-size: .73rem;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
}

.site-bildirim-kapat {
    display: inline-grid;
    width: 30px;
    height: 30px;
    flex: 0 0 auto;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--metin-soluk);
    cursor: pointer;
    font: 700 1.2rem/1 system-ui, sans-serif;
}

.site-bildirim-kapat:hover,
.site-bildirim-kapat:focus-visible {
    background: color-mix(in srgb, var(--bildirim-rengi, var(--vurgu)) 12%, transparent);
    color: var(--metin);
}

.site-popup-katmani {
    position: fixed;
    inset: 0;
    z-index: 1900;
    display: grid;
    place-items: center;
    padding: 18px;
    background: rgb(5 13 15 / .58);
    backdrop-filter: blur(8px);
}

.site-popup-katmani[hidden] { display: none; }

.site-popup {
    --bildirim-rengi: var(--vurgu);
    display: grid;
    width: min(100%, 520px);
    gap: 12px;
    padding: clamp(22px, 5vw, 34px);
    border: 1px solid color-mix(in srgb, var(--bildirim-rengi) 42%, var(--border));
    border-radius: 16px;
    background: color-mix(in srgb, var(--yuzey) 96%, transparent);
    box-shadow: 0 30px 80px rgb(0 0 0 / .34);
}

.site-popup--success { --bildirim-rengi: var(--basari); }
.site-popup--warning { --bildirim-rengi: var(--uyari); }
.site-popup--critical { --bildirim-rengi: var(--tehlike); }

.site-popup h2,
.site-popup p { margin: 0; }
.site-popup h2 { font-size: clamp(1.15rem, 4vw, 1.55rem); }
.site-popup p { color: var(--metin-soluk); line-height: 1.58; }
.site-popup-islemler {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 4px;
}

.site-popup-kapat {
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid var(--border);
    border-radius: 8px;
    background: var(--yuzey-2);
    color: var(--metin);
    cursor: pointer;
    font-size: .74rem;
    font-weight: 800;
}

body.site-popup-acik { overflow: hidden; }

@media (max-width: 640px) {
    .site-bildirim-eylem { margin-left: 18px; }
    .site-bildirim { flex-wrap: wrap; }
    .site-bildirim-metin { flex-basis: calc(100% - 52px); }
    .site-bildirim-kapat { margin-left: auto; }
    .site-popup-islemler > * { flex: 1 1 100%; }
}

/* --------------------------------------------------------------------------
   Yazkenara 2.14 · tek satır koyu cam header
   -------------------------------------------------------------------------- */
.site-header {
    border-bottom-color: rgba(143, 198, 181, 0.2);
    background:
        linear-gradient(135deg, rgba(10, 17, 23, 0.82), rgba(18, 28, 37, 0.72));
    box-shadow: 0 8px 28px rgba(5, 12, 16, 0.2);
    -webkit-backdrop-filter: blur(18px) saturate(128%);
    backdrop-filter: blur(18px) saturate(128%);
}

.site-header-icerik {
    flex-wrap: nowrap;
}

.site-header .site-logo {
    margin-right: 16px;
}

.site-header .sekme-btn {
    color: rgba(231, 242, 238, 0.72);
}

.site-header .sekme-btn:hover,
.site-header .sekme-btn:focus-visible,
.site-header .sekme-btn.aktif {
    background: rgba(255, 255, 255, 0.07);
    color: #f5fbf8;
}

.site-header .sekme-btn:not(.sekme-btn--uye) + .sekme-btn:not(.sekme-btn--uye)::before {
    background: linear-gradient(to bottom, transparent, rgba(85, 219, 176, 0.52), transparent);
}

.site-header .sekme-btn--uye {
    margin-left: 16px;
}

.site-header .tema-btn {
    width: 27px;
    height: 24px;
    margin-left: 2px;
    border-color: rgba(205, 235, 225, 0.22);
    border-radius: 7px;
    background: rgba(255, 255, 255, 0.055);
    box-shadow: none;
    color: rgba(231, 242, 238, 0.75);
}

.site-header .tema-btn:hover,
.site-header .tema-btn:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(47, 216, 175, 0.58);
    background: rgba(47, 216, 175, 0.1);
    color: #f5fbf8;
}

.site-header .tema-ikon {
    width: 13px;
    height: 13px;
}

.site-header .sekme-btn--uye.oturum-acik::before {
    border-color: #101a21;
}

@media (max-width: 720px) {
    :root {
        --header-yukseklik: 48px;
    }

    .site-header-icerik {
        display: flex;
        width: 100%;
        min-width: 0;
        min-height: var(--header-yukseklik);
        flex-wrap: nowrap;
        justify-content: center;
        gap: 1px;
        padding: 4px max(6px, env(safe-area-inset-right)) 4px max(6px, env(safe-area-inset-left));
    }

    .site-header .site-logo {
        display: inline-flex;
        flex: 0 0 auto;
        margin-right: 8px;
    }

    .site-header .site-logo img {
        width: auto;
        height: 27px;
    }

    .site-header .site-nav {
        display: flex;
        width: auto;
        min-width: 0;
        max-width: none;
        flex: 0 1 auto;
        flex-wrap: nowrap;
        justify-content: center;
        overflow: visible;
    }

    .site-header .sekme-btn {
        min-height: 28px;
        padding: 4px 5px 6px;
        border-radius: 7px;
        font-size: clamp(0.62rem, 2.55vw, 0.72rem);
    }

    .site-header .sekme-btn--uye {
        width: 30px;
        min-width: 30px;
        margin-left: 8px;
        padding-right: 4px;
        padding-left: 4px;
    }

    .site-header .sekme-btn-ikon {
        width: 18px;
        height: 18px;
    }

    .site-header .tema-btn {
        grid-column: auto;
        grid-row: auto;
        width: 24px;
        height: 23px;
        justify-self: auto;
        margin-left: 1px;
    }

    .site-main {
        padding-top: 16px;
    }
}

@media (max-width: 390px) {
    .site-header .site-logo {
        margin-right: 5px;
    }

    .site-header .site-logo img {
        height: 24px;
    }

    .site-header .sekme-btn {
        padding-right: 4px;
        padding-left: 4px;
        font-size: 0.61rem;
    }

    .site-header .sekme-btn--uye {
        width: 27px;
        min-width: 27px;
        margin-left: 5px;
    }

    .site-header .tema-btn {
        width: 22px;
        height: 22px;
    }
}

/* --------------------------------------------------------------------------
   Yazkenara 2.15 · izole ve modüler reklam alanları
   -------------------------------------------------------------------------- */
.site-yayin-kabugu {
    display: grid;
    width: min(100%, 1940px);
    flex: 1 0 auto;
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    column-gap: clamp(10px, 1.45vw, 24px);
    margin: 0 auto;
}

.site-yayin-kabugu[data-ad-left="true"] {
    grid-template-columns: var(--yk-ad-left-width, 160px) minmax(0, 1fr);
}

.site-yayin-kabugu[data-ad-right="true"] {
    grid-template-columns: minmax(0, 1fr) var(--yk-ad-right-width, 160px);
}

.site-yayin-kabugu[data-ad-left="true"][data-ad-right="true"] {
    grid-template-columns: var(--yk-ad-left-width, 160px) minmax(0, 1fr) var(--yk-ad-right-width, 160px);
}

.site-yayin-merkez {
    min-width: 0;
}

.site-yayin-merkez > .site-main {
    width: min(100%, 1500px);
    margin-right: auto;
    margin-left: auto;
}

.site-reklam-yan,
.site-alt-reklam-kabugu,
.site-reklam-yuvasi {
    min-width: 0;
}

.site-reklam-yan[hidden],
.site-alt-reklam-kabugu[hidden],
.site-reklam-yuvasi[hidden] {
    display: none !important;
}

.site-reklam-yan {
    position: sticky;
    top: calc(var(--header-yukseklik) + 16px);
    width: var(--yk-ad-width, 160px);
    height: var(--yk-ad-height, 600px);
    margin-top: clamp(20px, 3vw, 42px);
    overflow: hidden;
}

.site-reklam-yan--sol {
    justify-self: end;
}

.site-reklam-yan--sag {
    justify-self: start;
}

.site-reklam-yuvasi {
    position: relative;
    width: min(100%, 970px);
    height: var(--yk-ad-height, 100px);
    margin: 14px auto 18px;
    overflow: hidden;
    border: 0;
    background: transparent;
}

.site-reklam-yuvasi--top {
    margin-top: 12px;
    margin-bottom: 16px;
}

.kenar-modulu > .site-reklam-yuvasi--top {
    width: min(100%, 640px);
}

.site-reklam-yuvasi iframe,
.site-reklam-yan iframe,
.site-alt-reklam-kabugu iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent;
}

.site-alt-reklam-kabugu {
    width: 100%;
    min-height: var(--yk-ad-height, 100px);
    padding: 0 clamp(14px, 3vw, 40px) clamp(18px, 3vw, 34px);
}

.site-alt-reklam-kabugu > iframe {
    width: min(100%, 970px);
    height: var(--yk-ad-height, 100px);
    margin: 0 auto;
}

@media (max-width: 720px) {
    .site-yayin-kabugu,
    .site-yayin-kabugu[data-ad-left="true"],
    .site-yayin-kabugu[data-ad-right="true"],
    .site-yayin-kabugu[data-ad-left="true"][data-ad-right="true"] {
        grid-template-columns: minmax(0, 1fr);
        column-gap: 0;
    }

    .site-reklam-yan {
        display: none !important;
    }

    .site-reklam-yuvasi {
        max-width: calc(100vw - 16px);
        margin-top: 9px;
        margin-bottom: 13px;
    }

    .site-alt-reklam-kabugu {
        padding-right: 8px;
        padding-bottom: 14px;
        padding-left: 8px;
    }
}

/* 2.18 · üst çubuk özel mesaj rozeti */
.site-mesaj-btn {
    position: relative;
    display: inline-grid;
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--logo-yesil);
    cursor: pointer;
    transition: color 160ms ease, background-color 160ms ease, filter 160ms ease, transform 160ms ease;
}

.site-mesaj-btn[hidden] {
    display: none !important;
}

.site-mesaj-btn > svg {
    width: 20px;
    height: 20px;
}

.site-mesaj-btn:hover,
.site-mesaj-btn:focus-visible,
.site-mesaj-btn[aria-expanded="true"],
.site-mesaj-btn.okunmamis-var {
    background: color-mix(in srgb, var(--pastel-yesil) 34%, transparent);
    color: color-mix(in srgb, var(--logo-yesil) 74%, white);
    filter: drop-shadow(0 0 7px color-mix(in srgb, var(--logo-yesil) 52%, transparent));
}

.site-mesaj-btn:active {
    transform: translateY(1px);
}

.site-mesaj-rozet {
    position: absolute;
    top: -4px;
    right: -5px;
    display: grid;
    min-width: 17px;
    height: 17px;
    place-items: center;
    padding: 0 4px;
    border: 2px solid color-mix(in srgb, var(--yuzey) 88%, transparent);
    border-radius: 999px;
    background: #d85b52;
    color: #fff;
    font-size: .58rem;
    font-weight: 850;
    line-height: 1;
    box-shadow: 0 4px 10px rgba(0,0,0,.22);
}

.site-mesaj-rozet[hidden] {
    display: none !important;
}

/* 2.18 · özel mesaj merkezi */
.mesaj-katmani {
    position: fixed;
    z-index: 1300;
    inset: 0;
    display: grid;
    justify-items: end;
    background: rgba(4, 10, 9, .38);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
}

.mesaj-katmani[hidden] {
    display: none !important;
}

.mesaj-panel {
    display: grid;
    grid-template-rows: auto auto minmax(0, 1fr);
    width: min(440px, 100vw);
    height: 100dvh;
    overflow: hidden;
    border-left: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
    background: color-mix(in srgb, var(--yuzey) 93%, transparent);
    box-shadow: -24px 0 58px rgba(0, 0, 0, .24);
    color: var(--metin);
    animation: mesaj-panel-giris 190ms cubic-bezier(.2,.75,.2,1);
}

@keyframes mesaj-panel-giris {
    from { opacity: 0; transform: translateX(18px); }
    to { opacity: 1; transform: translateX(0); }
}

.mesaj-panel-baslik {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    min-height: 68px;
    padding: max(12px, env(safe-area-inset-top)) 15px 11px;
    border-bottom: 1px solid var(--border);
    background: color-mix(in srgb, var(--yuzey) 94%, transparent);
}

.mesaj-panel-baslik > div {
    min-width: 0;
}

.mesaj-panel-baslik span,
.mesaj-panel-baslik h2 {
    display: block;
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mesaj-panel-baslik span {
    color: var(--metin-soluk);
    font-size: .62rem;
    font-weight: 750;
    letter-spacing: .06em;
    text-transform: uppercase;
}

.mesaj-panel-baslik h2 {
    margin-top: 2px;
    font-size: 1rem;
    letter-spacing: -.025em;
}

.mesaj-geri,
.mesaj-kapat {
    display: grid;
    width: 34px;
    height: 34px;
    place-items: center;
    padding: 0;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--yuzey-2);
    color: var(--metin);
    cursor: pointer;
    font-size: 1.35rem;
    line-height: 1;
}

.mesaj-geri[hidden] {
    display: none !important;
}

.mesaj-panel-durum {
    margin: 10px 14px 0;
    padding: 9px 11px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: var(--yuzey-2);
    color: var(--metin-soluk);
    font-size: .73rem;
    line-height: 1.45;
}

.mesaj-panel-durum[data-tone="error"] {
    border-color: color-mix(in srgb, var(--tehlike) 45%, var(--border));
    color: var(--tehlike);
}

.mesaj-panel-durum[data-tone="success"] {
    border-color: color-mix(in srgb, var(--basari) 45%, var(--border));
    color: var(--basari);
}

.mesaj-panel-durum[data-tone="warning"] {
    border-color: color-mix(in srgb, #d5942b 48%, var(--border));
    color: color-mix(in srgb, #d5942b 78%, var(--metin));
}

.mesaj-panel-durum[hidden] {
    display: none !important;
}

.mesaj-liste-gorunumu,
.mesaj-konusma-gorunumu {
    min-height: 0;
    overflow: hidden;
}

.mesaj-liste-gorunumu {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
}

.mesaj-liste-gorunumu[hidden],
.mesaj-konusma-gorunumu[hidden] {
    display: none !important;
}

.mesaj-kural-ozeti {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 15px 10px;
    color: var(--metin-soluk);
    font-size: .68rem;
}

.mesaj-kural-ozeti a {
    color: var(--sekme-aktif);
    font-weight: 760;
}

.mesaj-konusma-listesi {
    display: grid;
    align-content: start;
    gap: 7px;
    min-height: 0;
    padding: 3px 12px 18px;
    overflow: auto;
    overscroll-behavior: contain;
}

.mesaj-konusma-satiri {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 10px;
    border: 1px solid var(--border);
    border-radius: 13px;
    background: var(--yuzey-2);
    color: var(--metin);
    text-align: left;
    cursor: pointer;
}

.mesaj-konusma-satiri:hover,
.mesaj-konusma-satiri:focus-visible {
    border-color: color-mix(in srgb, var(--sekme-aktif) 42%, var(--border));
    background: color-mix(in srgb, var(--pastel-yesil) 17%, var(--yuzey));
}

.mesaj-konusma-avatar {
    display: grid;
    width: 38px;
    height: 38px;
    place-items: center;
    border: 1px solid color-mix(in srgb, var(--sekme-aktif) 28%, var(--border));
    border-radius: 12px;
    background: var(--yuzey);
    color: var(--sekme-aktif);
    font-size: .72rem;
    font-weight: 850;
}

.mesaj-konusma-metin {
    min-width: 0;
}

.mesaj-konusma-metin strong,
.mesaj-konusma-metin span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mesaj-konusma-metin strong {
    font-size: .8rem;
}

.mesaj-konusma-metin span {
    margin-top: 3px;
    color: var(--metin-soluk);
    font-size: .68rem;
}

.mesaj-konusma-zaman {
    display: grid;
    justify-items: end;
    gap: 5px;
    color: var(--metin-soluk);
    font-size: .59rem;
}

.mesaj-konusma-zaman b {
    display: grid;
    min-width: 19px;
    height: 19px;
    place-items: center;
    padding: 0 5px;
    border-radius: 999px;
    background: var(--sekme-aktif);
    color: #fff;
    font-size: .58rem;
}

.mesaj-bos {
    display: grid;
    min-height: 230px;
    place-items: center;
    padding: 30px;
    color: var(--metin-soluk);
    text-align: center;
    font-size: .76rem;
    line-height: 1.6;
}

.mesaj-engel-listesi {
    padding: 0 15px 16px;
    color: var(--metin-soluk);
    font-size: .67rem;
}

.mesaj-konusma-gorunumu {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto auto auto;
}

.mesaj-hedef-ozeti {
    margin: 10px 13px 0;
    padding: 9px 11px;
    border-left: 3px solid var(--sekme-aktif);
    border-radius: 8px;
    background: var(--yuzey-2);
    color: var(--metin-soluk);
    font-size: .68rem;
    line-height: 1.45;
}

.mesaj-akisi {
    display: flex;
    min-height: 0;
    flex-direction: column;
    gap: 8px;
    padding: 14px 13px;
    overflow: auto;
    overscroll-behavior: contain;
}

.mesaj-balonu {
    position: relative;
    max-width: 84%;
    padding: 9px 11px 7px;
    border: 1px solid var(--border);
    border-radius: 13px 13px 13px 4px;
    background: var(--yuzey-2);
    color: var(--metin);
    overflow-wrap: anywhere;
}

.mesaj-balonu--ben {
    align-self: flex-end;
    border-color: color-mix(in srgb, var(--sekme-aktif) 32%, var(--border));
    border-radius: 13px 13px 4px 13px;
    background: color-mix(in srgb, var(--pastel-yesil) 22%, var(--yuzey));
}

.mesaj-balonu p {
    margin: 0;
    font-size: .78rem;
    line-height: 1.48;
}

.mesaj-balonu footer {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin-top: 5px;
    color: var(--metin-soluk);
    font-size: .56rem;
}

.mesaj-balonu footer button {
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--tehlike);
    cursor: pointer;
    font-size: .56rem;
}

.mesaj-oncekiler {
    justify-self: center;
    margin: 0 0 7px;
    padding: 5px 9px;
    border: 1px solid var(--border);
    border-radius: 999px;
    background: var(--yuzey-2);
    color: var(--metin-soluk);
    cursor: pointer;
    font-size: .62rem;
}

.mesaj-yaz-formu {
    display: grid;
    gap: 7px;
    padding: 10px 13px;
    border-top: 1px solid var(--border);
    background: color-mix(in srgb, var(--yuzey) 96%, transparent);
}

.mesaj-yaz-formu textarea {
    width: 100%;
    min-height: 74px;
    max-height: 130px;
    resize: vertical;
    padding: 10px 11px;
    border: 1px solid var(--border);
    border-radius: 11px;
    outline: 0;
    background: var(--yuzey-2);
    color: var(--metin);
    font: inherit;
    font-size: .76rem;
    line-height: 1.45;
}

.mesaj-yaz-formu textarea:focus {
    border-color: color-mix(in srgb, var(--sekme-aktif) 52%, var(--border));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--sekme-aktif) 12%, transparent);
}

.mesaj-yaz-alt {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.mesaj-yaz-alt > span,
.mesaj-yaz-formu > small {
    color: var(--metin-soluk);
    font-size: .61rem;
}

.mesaj-yaz-formu > small {
    line-height: 1.45;
}

.mesaj-konusma-islemleri {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 7px 13px max(9px, env(safe-area-inset-bottom));
    border-top: 1px solid var(--border);
}

.mesaj-konusma-islemleri button {
    padding: 4px 0;
    border: 0;
    background: transparent;
    color: var(--metin-soluk);
    cursor: pointer;
    font-size: .62rem;
}

.mesaj-konusma-islemleri button:hover {
    color: var(--tehlike);
}

.mesaj-bildirimi {
    position: fixed;
    z-index: 1400;
    top: calc(var(--header-yukseklik, 64px) + 12px);
    right: 14px;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    width: min(350px, calc(100vw - 28px));
    padding: 8px 8px 8px 12px;
    border: 1px solid color-mix(in srgb, var(--sekme-aktif) 42%, var(--border));
    border-radius: 13px;
    background: color-mix(in srgb, var(--yuzey) 94%, transparent);
    box-shadow: 0 16px 40px rgba(0,0,0,.22);
    -webkit-backdrop-filter: blur(16px);
    backdrop-filter: blur(16px);
}

.mesaj-bildirimi[hidden] {
    display: none !important;
}

.mesaj-bildirimi > button:first-child {
    display: grid;
    gap: 2px;
    padding: 4px;
    border: 0;
    background: transparent;
    color: var(--metin);
    text-align: left;
    cursor: pointer;
}

.mesaj-bildirimi strong {
    font-size: .73rem;
}

.mesaj-bildirimi span {
    color: var(--metin-soluk);
    font-size: .66rem;
}

.mesaj-bildirimi > button:last-child {
    width: 28px;
    height: 28px;
    border: 0;
    border-radius: 8px;
    background: var(--yuzey-2);
    color: var(--metin-soluk);
    cursor: pointer;
}

html.mesaj-panel-acik,
html.mesaj-panel-acik body {
    overflow: hidden;
}

@media (max-width: 560px) {
    .site-mesaj-btn {
        width: 27px;
        height: 27px;
        border-radius: 7px;
    }

    .site-mesaj-btn > svg {
        width: 18px;
        height: 18px;
    }

    .mesaj-katmani {
        justify-items: stretch;
    }

    .mesaj-panel {
        width: 100vw;
        border-left: 0;
    }

    .mesaj-panel-baslik {
        min-height: 60px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mesaj-panel {
        animation: none;
    }
}