/* ============================================================
   Kamu Haber Platformu — site teması
   Renkler ve biçim dili, kendi index.html'inizden alındı:
   navy #0c2340 · navy-light #1e3a5f · kırmızı #c8102e
   altın #d4a017 · zemin #f7f8fa · Segoe UI · yuvarlak kartlar
   ============================================================ */
:root{
  --navy:#0c2340; --navy-light:#1e3a5f; --navy-3:#2c5282;
  --red:#c8102e; --red-dark:#a30d26; --gold:#d4a017; --gold-deep:#8a6a0d;
  --bg:#f7f8fa; --surface:#ffffff; --surface-2:#eef1f5; --surface-3:#e2e7ee;
  --ink:#1f2937; --ink-2:#4b5563; --ink-3:#7b8494;
  --rule:#e2e8f0; --rule-soft:#eef1f5;
  --on-navy:#ffffff; --on-navy-soft:rgba(255,255,255,.72);
  --ok:#1b7a4b; --ok-bg:#e3f4ea;
  --warn:#9a6300; --warn-bg:#fdf1dc;
  --crit:#b3122c; --crit-bg:#fdeaec;
  --info:#1e3a5f; --info-bg:#e6ecf4;
  --s1:#c8102e; --s2:#d4a017;            /* grafik serileri — doğrulandı */
  --grid:#e6ebf1;
  --sans:'Segoe UI',Tahoma,Geneva,Verdana,-apple-system,Roboto,sans-serif;
  --shadow:0 1px 3px rgba(12,35,64,.08);
  --shadow-lg:0 20px 40px rgba(0,0,0,.12);
  --r:12px; --r-sm:8px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --navy:#0c2340; --navy-light:#16293f; --navy-3:#22456b;
  --red:#e04d5c; --red-dark:#c8102e; --gold:#e0b23c; --gold-deep:#e0b23c;
  --bg:#0a1220; --surface:#111c2e; --surface-2:#182338; --surface-3:#22304a;
  --ink:#e8edf4; --ink-2:#b3bdcc; --ink-3:#828d9f;
  --rule:#243149; --rule-soft:#1b2740;
  --ok:#5fc194; --ok-bg:#12312a;
  --warn:#e0a85c; --warn-bg:#332614;
  --crit:#f08a92; --crit-bg:#3a1c22;
  --info:#9dbde2; --info-bg:#16263c;
  --s1:#d4444f; --s2:#b0872a;
  --grid:#1e2b42;
  --shadow:0 1px 3px rgba(0,0,0,.4);
  --shadow-lg:0 20px 40px rgba(0,0,0,.5);
}}
:root[data-theme="dark"]{
  --navy:#0c2340; --navy-light:#16293f; --navy-3:#22456b;
  --red:#e04d5c; --red-dark:#c8102e; --gold:#e0b23c; --gold-deep:#e0b23c;
  --bg:#0a1220; --surface:#111c2e; --surface-2:#182338; --surface-3:#22304a;
  --ink:#e8edf4; --ink-2:#b3bdcc; --ink-3:#828d9f;
  --rule:#243149; --rule-soft:#1b2740;
  --ok:#5fc194; --ok-bg:#12312a;
  --warn:#e0a85c; --warn-bg:#332614;
  --crit:#f08a92; --crit-bg:#3a1c22;
  --info:#9dbde2; --info-bg:#16263c;
  --s1:#d4444f; --s2:#b0872a;
  --grid:#1e2b42;
  --shadow:0 1px 3px rgba(0,0,0,.4);
  --shadow-lg:0 20px 40px rgba(0,0,0,.5);
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:15.5px;line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0;font-weight:700;text-wrap:balance}
p{margin:0}
button{font:inherit;color:inherit;cursor:pointer}
a{color:var(--navy-3)}
:root[data-theme="dark"] a{color:var(--info)}
:focus-visible{outline:2px solid var(--gold);outline-offset:2px;border-radius:4px}
.fade{animation:fade .35s ease}
@keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- önizleme şeridi ---------- */
/* Üretimde önizleme çubuğu ve rol seçici tamamen gizlenir:
   ziyaretçi "demo verisi" yazısını ya da rol değiştirme kutusunu
   görmemeli. body.uretim sınıfı JS tarafından, kökene bakılarak
   eklenir. */
body.uretim .demo-bar{display:none!important}

.demo-bar{background:#08182c;color:var(--on-navy-soft);font-size:12px;
  display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;padding:.45rem clamp(.75rem,3vw,1.5rem)}
.demo-bar b{color:var(--gold);font-weight:600;letter-spacing:.08em}
.demo-bar .sep{opacity:.3}
.demo-bar input[type=text]{font:inherit;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);
  color:#fff;padding:.25rem .7rem;border-radius:999px;width:min(19rem,52vw)}
.demo-bar input[type=text]::placeholder{color:rgba(255,255,255,.4)}
.demo-bar button{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:#fff;
  padding:.22rem .8rem;border-radius:999px;font-size:12px}
.demo-bar button:hover{background:rgba(255,255,255,.2)}

/* ---------- başlık ---------- */
header.site{background:var(--navy);color:var(--on-navy);position:sticky;top:0;z-index:40;
  box-shadow:0 4px 14px rgba(12,35,64,.25)}
/* Telefonda üst bölüm üç satıra bölünüp ekranın üçte birini kaplıyordu
   ve kaydırırken de yerinde kalıyordu. Dar ekranda sabit değil, daha
   sıkı: logo küçük, menü yatay kaydırılır tek satır, giriş düğmesi
   logonun yanında. */
/* (Seçiciler "header.site …" ile başlıyor: aşağıdaki genel nav.main
   kuralı dosyada sonra geldiği için aynı güçteki seçici onu ezemiyordu.) */
@media (max-width:700px){
  header.site{position:static}
  header.site .site-in{gap:.5rem;padding:.5rem .75rem;flex-wrap:wrap}
  header.site .brand img{height:42px}
  header.site .brand .tag{font-size:.66rem;max-width:7.5rem}
  header.site nav.main{order:3;flex-basis:100%;margin-left:0;flex-wrap:nowrap;overflow-x:auto;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;padding-bottom:.15rem}
  header.site nav.main::-webkit-scrollbar{display:none}
  header.site nav.main button{white-space:nowrap;padding:.4rem .7rem;font-size:.88rem;flex:none}
  header.site #authArea{order:2;margin-left:auto}
  header.site #authArea .btn{padding:.35rem .8rem;font-size:.82rem}
}
.site-in{max-width:80rem;margin:0 auto;padding:.6rem clamp(.75rem,3vw,1.5rem);
  display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--on-navy)}
.brand img{height:58px;width:auto;border-radius:var(--r-sm);background:#fff;padding:3px;flex:none}
.brand .tag{font-size:.72rem;color:var(--on-navy-soft);line-height:1.2}
.brand .tag b{display:block;font-size:.95rem;color:#fff;font-weight:600;letter-spacing:.01em}
nav.main{display:flex;gap:.2rem;flex-wrap:wrap;margin-left:auto}
nav.main button{background:none;border:none;padding:.45rem .8rem;border-radius:999px;
  color:var(--on-navy-soft);font-size:.92rem}
nav.main button:hover{color:var(--gold)}
nav.main button[aria-current="page"]{background:rgba(255,255,255,.12);color:#fff;font-weight:600}
/* Sosyal medya simgeleri (menünün solunda) */
nav.main{align-items:center}
nav.main a.sosyal{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;
  border-radius:50%;color:#fff;transition:transform .15s,filter .15s;flex:none}
nav.main a.sosyal:hover{transform:translateY(-1px);filter:brightness(1.1)}
nav.main a.sosyal:focus-visible{outline:2px solid var(--gold);outline-offset:2px}
nav.main a.sosyal.wa{background:#25d366}
nav.main a.sosyal.ig{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
nav.main a.sosyal.ig + button{margin-left:.35rem}
/* Menüdeki genel arama kutusu */
nav.main .nav-ara{display:flex;align-items:center;margin-left:.35rem;flex:none;
  background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);border-radius:999px}
nav.main .nav-ara input{background:none;border:none;color:#fff;font:inherit;font-size:.86rem;
  width:9.5rem;padding:.38rem .2rem .38rem .8rem;outline:none}
nav.main .nav-ara input::placeholder{color:rgba(255,255,255,.62)}
nav.main .nav-ara button{padding:.35rem .6rem;color:#fff;display:flex}
nav.main .nav-ara:focus-within{border-color:var(--gold)}
/* Arama ekranındaki büyük kutu */
.arama-genis{display:flex;gap:.5rem;margin:0 0 1rem;max-width:40rem}
.arama-genis input{flex:1}
/* Bildirimlerim listesi */
.ihbarlarim{display:flex;flex-direction:column;gap:0;padding:.3rem 1rem}
.ihbarlarim .ihb{display:flex;gap:.7rem;align-items:center;flex-wrap:wrap;padding:.7rem 0;
  border-bottom:1px solid var(--rule-soft)}
.ihbarlarim .ihb:last-child{border-bottom:none}
.ihbarlarim .ihb > div{flex:1 1 16rem;min-width:0}
/* Sunucunun JavaScript'siz ziyaretçi ve arama motoru için koyduğu liste */
.ssr-liste{list-style:none;padding:0;margin:1rem 0;display:flex;flex-direction:column;gap:.9rem}
.ssr-liste li p{margin:.2rem 0;color:var(--ink-2);font-size:.9rem}
.ssr-liste time{font-size:.8rem;color:var(--ink-3)}
.rolebox{display:flex;align-items:center;gap:.4rem;font-size:.82rem;color:var(--on-navy-soft)}
.rolebox select{background:var(--navy-light);color:#fff;border:1px solid rgba(255,255,255,.2);
  padding:.35rem .6rem;border-radius:999px;font:inherit;font-size:.85rem}
select{font:inherit;font-size:.88rem;background:var(--surface);color:var(--ink);
  border:1px solid var(--rule);padding:.45rem .7rem;border-radius:var(--r-sm)}

main{max-width:80rem;margin:0 auto;padding:clamp(1rem,3vw,2rem) clamp(.75rem,3vw,1.5rem) 5rem;
  display:flex;flex-direction:column;gap:2rem}
.view{display:none;flex-direction:column;gap:1.5rem}
.view.on{display:flex}

/* ---------- hero ---------- */
.hero{background:linear-gradient(135deg,#0c2340 0%,#1e3a5f 50%,#2c5282 100%);
  color:#fff;border-radius:var(--r);padding:clamp(2rem,5vw,3.25rem) clamp(1.25rem,4vw,3rem);
  display:flex;flex-direction:column;gap:1rem;align-items:center;text-align:center}
.hero .pill{display:inline-flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.12);
  padding:.35rem .9rem;border-radius:999px;font-size:.82rem}
.hero .dot{width:8px;height:8px;border-radius:50%;background:#4ade80}
.hero h1{font-size:clamp(1.8rem,5vw,3rem);line-height:1.12}
.hero h1 em{font-style:normal;color:var(--gold)}
.hero p{max-width:44ch;opacity:.9;font-size:clamp(.95rem,2vw,1.1rem)}
.hero-two{display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:1rem;width:100%;margin-top:.75rem}
.hero-card{background:#fff;color:var(--navy);border-radius:var(--r);padding:1.5rem;text-align:left;
  border:none;display:flex;flex-direction:column;gap:.35rem;transition:transform .3s,box-shadow .3s}
.hero-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.hero-card .ic{width:52px;height:52px;border-radius:var(--r-sm);background:var(--navy);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.6rem;margin-bottom:.6rem}
.hero-card .k{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:#6b7280}
.hero-card h2{font-size:1.6rem}
.hero-card p{color:#4b5563;font-size:.88rem}
.hero-card .go{margin-top:.6rem;color:var(--red);font-weight:600;font-size:.9rem}
/* Telefonda karşılama alanı kısa: iki kutu yan yana, açıklamasız.
   Eskiden haberlere ulaşmak için neredeyse iki ekran kaydırılıyordu. */
@media (max-width:700px){
  .hero{padding:1.25rem 1rem;gap:.6rem}
  .hero .pill{font-size:.72rem}
  .hero h1{font-size:1.5rem}
  .hero > p{font-size:.88rem}
  .hero-two{grid-template-columns:1fr 1fr;gap:.6rem;margin-top:.3rem}
  .hero-card{padding:.85rem;gap:.15rem}
  .hero-card .ic{width:36px;height:36px;font-size:1.1rem;margin-bottom:.3rem}
  .hero-card h2{font-size:1.1rem}
  .hero-card p,.hero-card .k{display:none}
  .hero-card .go{margin-top:.2rem;font-size:.8rem}
}

/* ---------- ortak ---------- */
.sec-h{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap}
.sec-h h2{font-size:1.35rem;position:relative;padding-left:.75rem}
.sec-h h2::before{content:"";position:absolute;left:0;top:.22em;bottom:.22em;width:4px;
  background:var(--red);border-radius:2px}
.sec-h .cnt{font-size:.8rem;color:var(--ink-3)}
.sec-h .right{margin-left:auto;display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}

.card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);box-shadow:var(--shadow)}
.pad{padding:1.1rem 1.25rem}

.chip{font-size:.7rem;font-weight:600;padding:.22rem .7rem;border-radius:999px;white-space:nowrap;display:inline-block}
.chip.kamu{background:var(--info-bg);color:var(--info)}
.chip.sendika{background:var(--crit-bg);color:var(--crit)}
.chip.editorial{background:var(--ok-bg);color:var(--ok)}
.chip.ok{background:var(--ok-bg);color:var(--ok)}
.chip.warn{background:var(--warn-bg);color:var(--warn)}
.chip.crit{background:var(--crit-bg);color:var(--crit)}
.chip.mute{background:var(--surface-2);color:var(--ink-2)}
.chip.gold{background:#fdf3d9;color:var(--gold-deep)}
:root[data-theme="dark"] .chip.gold{background:#332614;color:var(--gold)}

.btn{background:var(--surface);border:1px solid var(--rule);padding:.45rem 1rem;border-radius:999px;
  font-size:.88rem;color:var(--ink);display:inline-flex;align-items:center;gap:.35rem;transition:.15s}
.btn:hover{background:var(--surface-2)}
.btn.pri{background:var(--red);border-color:var(--red);color:#fff;font-weight:600}
.btn.pri:hover{background:var(--red-dark);border-color:var(--red-dark)}
.btn.navy{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600}
.btn.navy:hover{background:var(--navy-light)}
.btn.ok{border-color:var(--ok);color:var(--ok)}
.btn.crit{border-color:var(--crit);color:var(--crit)}
.btn.sm{padding:.28rem .75rem;font-size:.82rem}
.btn.link{border:none;background:none;padding:0;color:var(--ink);font-weight:600;text-align:left}
.btn.link:hover{color:var(--red);background:none}

input[type=text],input[type=email],input[type=password],input[type=number],textarea{
  font:inherit;width:100%;background:var(--surface);color:var(--ink);border:1px solid var(--rule);
  padding:.55rem .8rem;border-radius:var(--r-sm)}
input:focus,textarea:focus,select:focus{outline:none;border-color:var(--navy-3);box-shadow:0 0 0 3px rgba(44,82,130,.15)}
textarea{min-height:7rem;resize:vertical}
label{display:flex;flex-direction:column;gap:.3rem;font-size:.84rem;color:var(--ink-2);font-weight:500}
/* [hidden] her şeyi yener. Tarayıcının kendi [hidden]{display:none}
   kuralı "user-agent" katmanındadır; yukarıdaki label{display:flex}
   gibi bizim yazdığımız her kural onu ezer. Bu yüzden el.hidden=true
   yazmak tek başına gizlemiyordu: satır ekranda kalıyordu.
   Tek satırlık bu kural, aynı hatayı sitedeki tüm öğeler için kapatır. */
[hidden]{display:none!important}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem}

/* ---------- haber kartları ---------- */
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(17.5rem,1fr));gap:1.1rem}
.ncard{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;
  display:flex;flex-direction:column;text-align:left;padding:0;box-shadow:var(--shadow);
  transition:transform .3s,box-shadow .3s}
.ncard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
/* Kart artık gerçek bağlantı (yeni sekmede açılabilsin, arama motoru
   izleyebilsin); bağlantı rengi ve alt çizgisi kart görünümünü bozmasın. */
a.ncard{color:inherit;text-decoration:none}
a.ncard:focus-visible{outline:3px solid var(--navy-3);outline-offset:2px}
/* Kart başı iş kolunun rengini taşır (--kol1/--kol2, haberKarti()
   satır içinde verir) ve iş kolunun adını yazar. Kategori etiketi
   ("Duyuru", "Toplu Sözleşme"…) kartta gösterilmez: kaynak rozeti
   zaten haberin türünü söylüyor, iki etiket kalabalık yapıyordu. */
.ncard .thumb{aspect-ratio:16/6;display:flex;align-items:flex-end;padding:.7rem .85rem;
  background:linear-gradient(135deg,var(--kol1,#0c2340) 0%,var(--kol2,#2c5282) 100%);color:#fff;
  position:relative}
.ncard .thumb .kol{display:flex;align-items:center;gap:.5rem;position:relative;z-index:1;
  min-width:0;text-shadow:0 1px 2px rgba(0,0,0,.35)}
.ncard .thumb .kol .ic{font-size:1.35rem;flex:none}
.ncard .thumb .kol b{display:block;font-size:.88rem;line-height:1.25;font-weight:700;
  overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.ncard .thumb .kol small{display:block;font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;opacity:.85}
/* Haberin kendi fotoğrafı varsa zemin o olur; iş kolu yazısı okunur
   kalsın diye alta iş kolu renginde bir perde çekilir. */
.ncard .thumb.foto{background-size:cover;background-position:50% 38%}
.ncard .thumb.foto::after{content:"";position:absolute;inset:auto 0 0 0;height:70%;
  background:linear-gradient(to bottom,transparent,var(--kol1,#0c2340))}
/* Kartın sol kenarında da iş kolu rengi: listede kartlar ayırt edilsin */
.ncard{border-top:4px solid var(--kol2,var(--rule))}
.ncard .body{padding:.9rem 1rem;display:flex;flex-direction:column;gap:.45rem;flex:1}
.ncard h3{font-size:1.03rem;line-height:1.3;font-weight:700}
.ncard p{font-size:.86rem;color:var(--ink-2);line-height:1.5}
.ncard .meta{margin-top:auto;padding-top:.35rem;display:flex;gap:.45rem;align-items:center;flex-wrap:wrap;
  font-size:.75rem;color:var(--ink-3)}
.ncard .meta .sec{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:14rem}

/* Ana sayfa vitrini: tek sıra, 5 haber. Geniş ekranda sayfaya sığar;
   dar ekranda yana kaydırılır (sayfa aşağı uzamaz). */
.news-row{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(14.5rem,1fr);gap:1rem;
  overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:.4rem;scrollbar-width:thin}
.news-row > .ncard{scroll-snap-align:start}
.news-row .ncard h3{font-size:.97rem;display:-webkit-box;-webkit-line-clamp:3;
  -webkit-box-orient:vertical;overflow:hidden}
.news-row .ncard p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.news-row .ncard:hover{transform:none}
@media (max-width:700px){.news-row{grid-auto-columns:78%}}

/* Güncel: sınav/alım/atama/maaş haberleri için sade liste */
.chip.guncel{background:#fdf3d9;color:var(--gold-deep)}
:root[data-theme="dark"] .chip.guncel{background:rgba(224,178,60,.16)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .chip.guncel{background:rgba(224,178,60,.16)}}
.gnc-liste{display:flex;flex-direction:column;padding:.25rem 1rem}
.gnc-liste .gnc{display:flex;align-items:center;gap:.75rem;padding:.7rem 0;color:inherit;
  text-decoration:none;border-bottom:1px solid var(--rule-soft)}
.gnc-liste .gnc:last-child{border-bottom:none}
.gnc-liste .gnc .chip{flex:none;min-width:5.6rem;text-align:center}
.gnc-liste .gnc .bas{flex:1;min-width:0;font-weight:600;font-size:.94rem;line-height:1.35}
.gnc-liste .gnc:hover .bas{color:var(--red)}
.gnc-liste .gnc time{flex:none;font-size:.78rem;color:var(--ink-3)}
@media (max-width:560px){
  .gnc-liste .gnc{flex-wrap:wrap;gap:.35rem .6rem}
  .gnc-liste .gnc .bas{flex-basis:100%;order:3}
}

/* ---------- iş kolları ---------- */
.tabs{display:flex;gap:.4rem;flex-wrap:wrap}
.tabs button{background:var(--surface);border:1px solid var(--rule);padding:.4rem 1.1rem;
  border-radius:999px;font-size:.88rem;color:var(--ink-2)}
.tabs button:hover{border-color:var(--navy-3)}
.tabs button[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600}
/* İş kolu kutuları: tam ad görünür (kırpılmaz), dokunmatik ekranda
   rahat basılacak yükseklikte; sol kenar iş kolunun rengi. */
.sec-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(17rem,1fr));gap:.85rem}
.sbtn{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);padding:1.05rem 1.1rem;
  min-height:4.6rem;display:flex;gap:.85rem;align-items:center;text-align:left;box-shadow:var(--shadow);
  border-left:6px solid var(--kol2,var(--navy-light));transition:.2s}
.sbtn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.sbtn .ic{font-size:1.7rem;flex:none}
.sbtn .nm{font-size:1rem;line-height:1.3;font-weight:600;color:var(--ink)}
.sbtn .nm small{display:block;font-size:.72rem;font-weight:500;color:var(--ink-3);
  text-transform:uppercase;letter-spacing:.06em;margin-top:.15rem}
.sbtn .n{margin-left:auto;font-size:.85rem;color:#fff;background:var(--kol2,var(--navy-light));
  min-width:2rem;text-align:center;padding:.15rem .55rem;border-radius:999px;flex:none}
.sec-h .tabs button{padding:.55rem 1.4rem;font-size:.95rem}
@media (max-width:600px){
  .sec-grid{grid-template-columns:1fr}
  .sbtn{min-height:4.2rem}
}

/* ---------- tablo ---------- */
.tw{overflow-x:auto;border:1px solid var(--rule);border-radius:var(--r);background:var(--surface);box-shadow:var(--shadow)}
table{border-collapse:collapse;width:100%;min-width:38rem;font-size:.88rem}
th,td{text-align:left;padding:.7rem .9rem;border-bottom:1px solid var(--rule-soft);vertical-align:middle}
thead th{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);
  font-weight:700;background:var(--surface-2);border-bottom:1px solid var(--rule);white-space:nowrap}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--surface-2)}
td.num{font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
th.num{text-align:right}
code{font-family:ui-monospace,Consolas,monospace;font-size:.85em;background:var(--surface-2);
  padding:.12em .45em;border-radius:4px}

/* ---------- istatistik ---------- */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(10.5rem,1fr));gap:1rem}
.tile{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);box-shadow:var(--shadow);
  padding:1rem 1.15rem;display:flex;flex-direction:column;gap:.15rem;border-top:3px solid var(--navy)}
.tile:nth-child(3){border-top-color:var(--red)}
.tile:nth-child(2){border-top-color:var(--gold)}
.tile dt{font-size:.74rem;text-transform:uppercase;letter-spacing:.07em;color:var(--ink-3);font-weight:600}
.tile dd{margin:0;font-size:1.85rem;line-height:1.15;font-variant-numeric:tabular-nums;font-weight:700;color:var(--navy)}
:root[data-theme="dark"] .tile dd{color:var(--ink)}
.tile small{font-size:.78rem;color:var(--ink-2)}

.chart-wrap{position:relative;background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--r);padding:1.1rem 1.25rem;box-shadow:var(--shadow)}
.legend{display:flex;gap:1.1rem;flex-wrap:wrap;font-size:.83rem;color:var(--ink-2);margin-bottom:.6rem}
.legend span{display:inline-flex;align-items:center;gap:.4rem}
.swatch{width:14px;height:3px;border-radius:2px;display:inline-block}
.tip{position:absolute;pointer-events:none;background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--r-sm);padding:.55rem .7rem;font-size:.82rem;box-shadow:var(--shadow-lg);
  opacity:0;transition:opacity .12s;min-width:10rem;z-index:5}
.tip b{display:block;font-size:.74rem;color:var(--ink-3);margin-bottom:.25rem;font-weight:600}
.tip .row{display:flex;justify-content:space-between;gap:1rem;font-variant-numeric:tabular-nums}

/* ---------- yorumlar ---------- */
.cmt{display:flex;flex-direction:column;gap:.3rem;padding:.85rem 0;border-bottom:1px solid var(--rule-soft)}
.cmt:last-child{border-bottom:none}
.cmt .who{display:flex;gap:.6rem;align-items:baseline;font-size:.86rem}
.cmt .who b{font-weight:700}
.cmt .who time{font-size:.74rem;color:var(--ink-3)}
.gate{background:var(--surface-2);border:1px dashed var(--rule);border-radius:var(--r);padding:1rem 1.2rem;
  font-size:.89rem;color:var(--ink-2);display:flex;gap:.85rem;align-items:center;flex-wrap:wrap}

/* ---------- makale ---------- */
.article{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);box-shadow:var(--shadow);
  padding:1.75rem clamp(1.1rem,3.5vw,2.5rem);display:flex;flex-direction:column;gap:1.1rem}
.article h1{font-size:clamp(1.5rem,4vw,2.15rem);line-height:1.2;color:var(--navy)}
:root[data-theme="dark"] .article h1{color:var(--ink)}
.article .lede{font-size:1.08rem;color:var(--ink-2);line-height:1.55;max-width:62ch;
  border-left:3px solid var(--gold);padding-left:1rem}
.article .txt{max-width:68ch;display:flex;flex-direction:column;gap:.9rem}
/* Haber kapağı. Kurumsal çerçeve görselin içinde basılı geliyor
   (üst şerit, logo, alan adı); burada yalnız yerleşimi var. */
.article .kapak{margin:0}
.article .kapak img{display:block;width:100%;height:auto;border-radius:var(--r);
  border:1px solid var(--rule);background:var(--surface-2)}
.article .kapak figcaption{font-size:.78rem;color:var(--ink-3);margin-top:.4rem}
/* Fotoğrafı olmayan haberde üstte sosyal medya kartı (1080x1080 kare)
   durur. Tam genişlikte ekranı kaplamasın; masaüstünde ortalı ve
   sınırlı, telefonda tam genişlik. */
.article .kapak.kart{display:flex;justify-content:center}
.article .kapak.kart img{max-width:30rem}
.amet{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;font-size:.8rem;color:var(--ink-3)}

/* ---------- kuyruk ---------- */
.qitem{background:var(--surface);border:1px solid var(--rule);border-left:4px solid var(--red);
  border-radius:var(--r);padding:1rem 1.15rem;display:flex;flex-direction:column;gap:.55rem;box-shadow:var(--shadow)}
.qitem.ai{border-left-color:var(--navy)}
.qitem.yorum{border-left-color:var(--gold)}
.qitem .top{display:flex;gap:.5rem;align-items:center;flex-wrap:wrap}
.qitem .t{font-weight:700;font-size:1rem;line-height:1.35}
.qitem .s{font-size:.87rem;color:var(--ink-2)}
.qitem .acts{display:flex;gap:.45rem;flex-wrap:wrap}

.note{background:#fdf3d9;border-left:4px solid var(--gold);border-radius:0 var(--r-sm) var(--r-sm) 0;
  padding:.85rem 1.1rem;font-size:.88rem;color:#5c4708}
:root[data-theme="dark"] .note{background:#2a2113;color:var(--ink-2)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .note{background:#2a2113;color:var(--ink-2)}}
/* Resmî Gazete künyesi: haberin dayandığı düzenleme, tarih ve sayı */
.rg-kunye{border:1px solid var(--rule);border-left:4px solid var(--navy-3);
  border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--surface-2);
  padding:.9rem 1.1rem;margin:1.1rem 0;font-size:.9rem}
.rg-kunye h2{font-size:.74rem;letter-spacing:.06em;text-transform:uppercase;
  color:var(--ink-3);margin:0 0 .55rem;font-weight:700}
.rg-kunye dl{display:grid;grid-template-columns:max-content 1fr;gap:.3rem .9rem;margin:0}
.rg-kunye dt{color:var(--ink-3);font-weight:600}
.rg-kunye dd{margin:0;color:var(--ink);overflow-wrap:anywhere}
.rg-kunye .eylem{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.75rem}
@media (max-width:520px){.rg-kunye dl{grid-template-columns:1fr}.rg-kunye dd{margin-bottom:.35rem}}
.empty{padding:2.5rem;text-align:center;color:var(--ink-3);font-size:.92rem}

.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);
  display:none;align-items:center;justify-content:center;padding:1rem;z-index:60}
.modal-bg.on{display:flex}
.modal{background:var(--surface);border-radius:var(--r);max-width:27rem;width:100%;
  padding:1.5rem;display:flex;flex-direction:column;gap:1rem;box-shadow:var(--shadow-lg)}
.modal h3{font-size:1.25rem;color:var(--navy)}
:root[data-theme="dark"] .modal h3{color:var(--ink)}

.toast{position:fixed;left:50%;bottom:1.5rem;transform:translateX(-50%) translateY(1rem);opacity:0;
  background:var(--navy);color:#fff;padding:.7rem 1.25rem;border-radius:999px;font-size:.88rem;
  transition:.2s;pointer-events:none;z-index:70;max-width:90vw;box-shadow:var(--shadow-lg)}
.toast.on{opacity:1;transform:translateX(-50%)}

/* Çerez onay bandı (Google Analytics, KVKK). Alt kenarda, içeriği
   kapatmadan; tercih yapılana kadar durur. */
.cerez{position:fixed;left:50%;bottom:1rem;transform:translateX(-50%);z-index:65;
  width:min(44rem,calc(100vw - 2rem));background:var(--surface);color:var(--ink);
  border:1px solid var(--rule);border-radius:var(--r);box-shadow:var(--shadow-lg);
  padding:.9rem 1rem;display:flex;gap:.8rem;align-items:center;flex-wrap:wrap;font-size:.86rem}
.cerez p{margin:0;flex:1 1 18rem;line-height:1.45}
.cerez .dugmeler{display:flex;gap:.45rem}
.foot-in .cerez-bag{background:none;border:none;padding:0;color:var(--on-navy-soft);
  text-decoration:underline;cursor:pointer;font:inherit;align-self:flex-start}
footer.site{background:var(--navy);color:var(--on-navy-soft);margin-top:1rem}
.foot-in{max-width:80rem;margin:0 auto;padding:2rem clamp(.75rem,3vw,1.5rem);font-size:.85rem;
  display:flex;flex-direction:column;gap:.7rem}
.foot-in img{height:44px;border-radius:var(--r-sm);background:#fff;padding:3px;align-self:flex-start}
.foot-in b{color:#fff}

/* ---------- giriş ekranları ---------- */
.auth-wrap{max-width:27rem;margin:1rem auto;display:flex;flex-direction:column;gap:1rem}
.auth-wrap.genis{max-width:36rem}
.auth-wrap.ikili{max-width:62rem;display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:1.25rem;align-items:start}
@media (max-width:880px){.auth-wrap.ikili{display:flex;flex-direction:column;max-width:36rem}}
.auth-card{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r);
  box-shadow:var(--shadow-lg);padding:1.75rem;display:flex;flex-direction:column;gap:1rem}
.auth-card h2{font-size:1.35rem;color:var(--navy)}
:root[data-theme="dark"] .auth-card h2{color:var(--ink)}
.auth-card .url{font-family:ui-monospace,Consolas,monospace;font-size:.78rem;color:var(--ink-3);
  background:var(--surface-2);padding:.35rem .7rem;border-radius:999px;align-self:flex-start}
.auth-note{font-size:.85rem;color:var(--ink-2);line-height:1.5}
.auth-switch{font-size:.86rem;color:var(--ink-2);text-align:center}
.auth-switch button{background:none;border:none;color:var(--red);font-weight:600;padding:0}
.kod-kutu{display:flex;gap:.5rem;justify-content:center}
.kod-kutu input{width:2.9rem;text-align:center;font-size:1.3rem;font-weight:700;padding:.6rem .2rem;
  font-variant-numeric:tabular-nums}
.sec-secim{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.4rem;
  max-height:14rem;overflow-y:auto;padding:.6rem;border:1px solid var(--rule);border-radius:var(--r-sm);
  background:var(--surface-2)}
.sec-secim label{flex-direction:row;align-items:flex-start;gap:.45rem;font-size:.8rem;font-weight:400;
  background:var(--surface);padding:.4rem .55rem;border-radius:var(--r-sm);cursor:pointer;line-height:1.3}
.sec-secim label:hover{background:var(--crit-bg)}
.sec-secim input{margin-top:.15rem}
.sec-secim input{width:auto;margin:0}

/* ---------- yükleme alanı ---------- */
.dropzone{border:2px dashed var(--rule);border-radius:var(--r);background:var(--surface-2);
  padding:1.75rem 1.25rem;text-align:center;display:flex;flex-direction:column;gap:.5rem;
  align-items:center;transition:.18s;cursor:pointer}
.dropzone:hover,.dropzone.uzerinde{border-color:var(--red);background:var(--crit-bg)}
.dropzone .ic{font-size:1.9rem;line-height:1}
.dropzone .bas{font-weight:600}
.dropzone .alt{font-size:.82rem;color:var(--ink-2);max-width:40ch}
.ek-liste{display:grid;grid-template-columns:repeat(auto-fill,minmax(11rem,1fr));gap:.7rem}
.ek{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-sm);overflow:hidden;
  display:flex;flex-direction:column;position:relative}
.ek.kapak{border-color:var(--red);box-shadow:0 0 0 2px var(--crit-bg)}
.ek .on{aspect-ratio:16/9;background:var(--surface-3);display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;overflow:hidden}
.ek .on img{width:100%;height:100%;object-fit:cover}
/* Video önizlemesi de fotoğrafla aynı kutuyu doldurur; yoksa
   16:9 kutunun içinde ortada minik bir dikdörtgen olarak durur. */
.ek .on video{width:100%;height:100%;object-fit:cover;background:#000}
/* Dönüştürme durumu. Renk tek başına bilgi taşımıyor: her durumun
   yanında metin de var, renk körlüğünde de okunur. */
.ek .islem-durum{font-size:.7rem;font-weight:600;display:block;line-height:1.35}
.ek .islem-durum.bekliyor{color:var(--gold-koyu,#8a6d0b)}
.ek .islem-durum.hazir{color:var(--green,#1a7f4b)}
.ek .islem-durum.hata{color:var(--red)}
:root:not([data-theme="light"]) .ek .islem-durum.bekliyor{color:var(--gold)}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .ek .islem-durum.bekliyor{color:var(--gold)}
}
/* Haber sayfasındaki video oynatıcısı */
figure video{width:100%;max-width:100%;height:auto;border-radius:var(--r-sm);
  background:#000;display:block}
.ek .bilgi{padding:.45rem .6rem;display:flex;flex-direction:column;gap:.25rem}
.ek .ad{font-size:.78rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ek .boy{font-size:.72rem;color:var(--ink-3)}
.ek .islem{display:flex;gap:.3rem;padding:0 .6rem .5rem}
.ek .islem button{font-size:.72rem;padding:.18rem .5rem;border-radius:999px;border:1px solid var(--rule);
  background:var(--surface)}
.ek .rozet{position:absolute;top:.4rem;left:.4rem;background:var(--red);color:#fff;font-size:.65rem;
  font-weight:700;padding:.15rem .5rem;border-radius:999px}

/* ---------- yayın yetkisi kartı ---------- */
/* Ödeme ekranının yerini alan durum kartı. Renk yalnız yardımcıdır:
   durum metni her koşulda yazılı, renk körlüğünde de okunur. */
.yetki-kart{background:var(--surface);border:1px solid var(--rule);
  border-left:4px solid var(--rule);border-radius:var(--r);padding:1.15rem 1.25rem;
  display:flex;flex-direction:column;gap:.55rem;box-shadow:var(--shadow)}
.yetki-kart.ok{border-left-color:var(--green,#1a7f4b)}
.yetki-kart.uyari{border-left-color:var(--gold)}
.yetki-kart.bekle{border-left-color:var(--navy-3,#2c5282)}
.yetki-kart.kotu{border-left-color:var(--red)}
.yetki-bas{display:flex;justify-content:space-between;align-items:baseline;
  gap:1rem;flex-wrap:wrap}
.yetki-baslik{font-weight:700;font-size:1.05rem;color:var(--navy)}
:root[data-theme="dark"] .yetki-baslik{color:var(--ink)}
.yetki-kalan{font-size:.86rem;color:var(--ink-2);font-variant-numeric:tabular-nums}
.yetki-kalan b{font-size:1.15rem;color:var(--ink)}
.yetki-ac{margin:0;font-size:.89rem;color:var(--ink-2);line-height:1.6}
.yetki-belge{font-size:.85rem;color:var(--ink-2);background:var(--surface-2);
  border-radius:var(--r-sm);padding:.5rem .7rem;word-break:break-all}
.yetki-dugmeler{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.15rem}

/* ---------- paylaşım ---------- */
.paylas{display:flex;gap:.55rem;flex-wrap:wrap;align-items:center;
  border-top:1px solid var(--rule-soft);padding-top:1rem}
.paylas .et{font-size:.84rem;color:var(--ink-2);font-weight:600;margin-right:.2rem}
.pay-btn{display:inline-flex;align-items:center;gap:.4rem;padding:.45rem .9rem;border-radius:999px;
  border:none;color:#fff;font-size:.86rem;font-weight:600;text-decoration:none;transition:.15s}
.pay-btn:hover{filter:brightness(1.08)}
.pay-btn.wa{background:#25D366;color:#08331b}
.pay-btn.tg{background:#229ED9}
.pay-btn.x{background:#111}
.pay-btn.kopya{background:var(--surface-2);color:var(--ink);border:1px solid var(--rule)}
:root[data-theme="dark"] .pay-btn.x{background:#33393f}

/* ---------- seo paneli ---------- */
.seo-kutu{background:var(--surface-2);border:1px solid var(--rule);border-radius:var(--r);
  padding:1rem 1.15rem;display:flex;flex-direction:column;gap:.6rem}
.seo-kutu pre{margin:0;font-family:ui-monospace,Consolas,monospace;font-size:.74rem;line-height:1.5;
  background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-sm);
  padding:.7rem .85rem;overflow-x:auto;color:var(--ink-2)}
.serp{background:var(--surface);border:1px solid var(--rule);border-radius:var(--r-sm);padding:.85rem 1rem;
  display:flex;flex-direction:column;gap:.2rem;max-width:34rem}
.serp .yol{font-size:.76rem;color:var(--ink-3)}
.serp .bas{color:#1a0dab;font-size:1.05rem;font-weight:500;line-height:1.3}
:root[data-theme="dark"] .serp .bas{color:#8ab4f8}
.serp .aci{font-size:.83rem;color:var(--ink-2);line-height:1.45}
.kesfet{display:flex;gap:.75rem;background:var(--surface);border:1px solid var(--rule);
  border-radius:var(--r-sm);padding:.7rem;max-width:22rem;align-items:center}
.kesfet .gor{width:5.5rem;aspect-ratio:16/9;border-radius:6px;flex:none;
  background:linear-gradient(135deg,#0c2340,#2c5282)}
.kesfet .bas{font-size:.88rem;font-weight:600;line-height:1.3}
.kesfet .kay{font-size:.74rem;color:var(--ink-3)}

/* Yönetim girişi ayrı alan adındadır: site menüsü ve altbilgisi gösterilmez */
body.ayri-alan nav.main,body.ayri-alan #authArea,body.ayri-alan footer.site{display:none}
body.ayri-alan header.site .site-in{justify-content:center}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}