/* 4b · Bekçiler, kadim gemiler, Amiral Gemisi (DILIM-4b.md §9): Fener'in Bekçiler ve savunma kutuları, kadim gemiler canlı, Amiral sayfası,
   Tersane'de Amiral kartı, olay listesindeki kehribar bekçi satırı ve kadim görevsiz satır, Galaksi'de bekçi nöbeti ve kara delik, Filo'da kadim
   grubu ve sessiz uçuş, bekçi raporları. Kadim olan her şey serif yazı ve zümrüt çerçeve, bekçi olan her şey kehribar (hikaye.css'in deseni). */

:root { --kehribar-rgb: 240 168 67; }
.kehribar-yazi, .bekci-yazi { color: var(--kehribar); font-style: normal; }
.bekci-yazi .simge, .bekci-nobet .simge { width: 14px; height: 14px; margin-right: 3px; vertical-align: -2px; }

/* ——— Bekçi birimleri ızgarası (raporun öğe biçimi; Fener sayfasında da) ——— */
.bekci-izgara { --t: 52px; --ta: 6px; }
.casus-raporu .bekci-izgara { --t: clamp(46px, calc((100cqw - 70px) / 11), 62px); --ta: 5px; }
.bekci-izgara .rapor-oge-resim { box-shadow: 0 0 0 1px rgb(var(--kehribar-rgb) / .45); }
.bekci-teknoloji { margin: 0; font-size: 12px; }

/* ——— Fener: Bekçiler kutusu ——— */
.bekci-kutu { border-color: rgb(var(--kehribar-rgb) / .35); }
.bekci-kutu > .kutu-baslik { color: var(--kehribar); background: linear-gradient(180deg, #33250f, #1a1208); font-family: var(--kadim-tipi); font-size: 16px; }
.bekci-kutu .kutu-govde { display: grid; grid-template-columns: minmax(0, 1fr); gap: 10px; }   /* iz: içerik kutuyu genişletmesin (telefonda koşul sayacı taşıyordu) */
.bekci-siradaki { display: grid; gap: 6px; padding: 8px 10px; background: rgb(var(--kehribar-rgb) / .06); border: 1px solid rgb(var(--kehribar-rgb) / .3); border-radius: 6px; }
.bekci-siradaki p { margin: 0; font-size: 13px; }
.bekci-baslik { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.bekci-baslik b { color: var(--kehribar); font: 600 16px var(--kadim-tipi); }
.bekci-baslik .simge { width: 18px; height: 18px; color: var(--kehribar); }
.bekci-kosul { display: grid; grid-template-columns: minmax(0, auto) minmax(40px, 1fr) auto; gap: 8px; align-items: center; font-size: 12.5px; color: var(--yazi-2); }
.bekci-kosul > span:first-child { min-width: 0; }
/* Telefonda başlık kendi satırında, altında çubuk ve sayaç (sayaç kutunun sağ çerçevesinden taşmasın) */
@media (max-width: 899px) { .bekci-kosul { grid-template-columns: minmax(0, 1fr) auto; row-gap: 4px; } .bekci-kosul > span:first-child { grid-column: 1 / -1; } }
/* Telefonda sıradaki seferin bileşimi: 6 sütunlu rapor ızgarası (sayfalar.css) 52 px'lik kutularla kehribar kutuya sığmıyor, kutuyu (ve bütün
   Bekçiler kutusunu) genişletiyordu; burada kutular küçük */
@media (max-width: 899px) { .bekci-siradaki { grid-template-columns: minmax(0, 1fr); } .bekci-siradaki .bekci-izgara { --t: 44px; --ta: 5px; } }
.bekci-kosul .birikim-cubuk > span { background: linear-gradient(90deg, #a8701f, var(--kehribar)); }
.bekci-kosul.tamam .birikim-cubuk > span { background: linear-gradient(90deg, #2c9d5b, #93d356); }
.bekci-kosul b { display: inline-flex; align-items: center; gap: 4px; color: var(--kehribar); font-variant-numeric: tabular-nums; }
.bekci-kosul.tamam b { color: var(--yesil); }
.bekci-kosul b .simge { width: 14px; height: 14px; }
.bekci-ek > summary { cursor: pointer; color: var(--yazi-2); font-size: 12.5px; }
.bekci-ek[open] > summary { margin-bottom: 6px; }

/* Telefonda tek sütun: 4a'nın .fener-durum'u (1fr) içerikle genişlemesin */
@media (max-width: 899px) { .fener-durum.bekci-satiri { grid-template-columns: minmax(0, 1fr); } }

/* ——— Fener'in savunması ——— */
.fener-savunma-mevcut { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 0; padding: 0; list-style: none; font-size: 12.5px; }
.fener-savunma-mevcut li { display: inline-flex; align-items: center; gap: 6px; }
.fener-savunma-mevcut b { color: #fff; font-variant-numeric: tabular-nums; }
.savunma-resim { width: 28px; height: 28px; border-radius: 4px; object-fit: cover; }
.fener-savunma-sira .dugme { margin-left: auto; }
.fener-savunma-sira .dugme.onay-bekliyor { background: #6a1f1b; border-color: #c2453c; color: #fff; }
.fener-savunma-form { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.fener-savunma-form select, .fener-savunma-form input { min-width: 0; padding: 5px 8px; background: #0b1110; border: 1px solid var(--kenar-acik); border-radius: 4px; color: #fff; font-size: 13px; }
.fener-savunma-form input { width: 84px; }
.savunma-bedel { display: inline-flex; flex-wrap: wrap; gap: 4px 10px; font-size: 12.5px; }
.savunma-bedel .bedel-oge { display: inline-flex; align-items: center; gap: 3px; }
.savunma-bedel .satir-simge { width: 18px; height: 18px; }

/* ——— Fener: kadim gemiler canlı ——— */
.kadim-gemiler-canli > .bolum-adi { display: flex; align-items: center; gap: 6px; }
.kadim-gemi.canli { position: relative; }
.kadim-gemi.canli .kadim-gemi-resim .kart-etiket { z-index: 2; }
.kadim-gemi.canli > b { display: flex; align-items: center; gap: 4px; flex-wrap: wrap; }
.kadim-gemi.canli > b .fener-soru { margin-left: 2px; font-family: var(--yazi-tipi); }
.kadim-gemi.canli .fener-soru p { font: 400 12px/1.4 var(--yazi-tipi); }
.kadim-gemi-durum { color: var(--yazi-2); font-size: 12px; line-height: 1.35; }
.kadim-gemi-durum b { color: #fff; font-variant-numeric: tabular-nums; }
.kadim-gemi.durum-uyanmadi { opacity: .62; }
.kadim-gemi.durum-uyanmadi .kadim-gemi-resim img { filter: grayscale(.8) brightness(.55); }
.kadim-gemi.durum-fener { border-color: rgba(67, 211, 145, .6); box-shadow: 0 0 10px rgba(67, 211, 145, .12); }
.kadim-gemi.durum-fener .uyku { color: var(--zumrut); }
.kadim-gemi.durum-uyku .uyku { color: #b9c6d6; }
.kadim-gemi.durum-uyku .kadim-gemi-resim img { filter: saturate(.3) brightness(.55); }
.kadim-gemi.durum-yolda .uyku { color: var(--kehribar); }
.kadim-eylem { display: flex; flex-wrap: wrap; gap: 4px; }
.kadim-eylem select { min-width: 0; max-width: 100%; flex: 1 1 90px; padding: 3px 6px; background: #0b1110; border: 1px solid var(--kenar-acik); border-radius: 4px; color: #fff; font-size: 12px; }
.kadim-gemi .dugme.kucuk { font-size: 11.5px; }
.kadim-gemi.canli .dugme { max-width: 100%; white-space: normal; text-align: center; }
.kadim-eylem > .dugme { flex: 1 1 auto; min-width: 0; }

/* ——— Fener'deki Amiral kutusu: rütbe ve bağlantı ——— */
.amiral-rutbe-satir { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; font-size: 13px; }
.amiral-rutbe-satir > .simge { width: 18px; height: 18px; color: var(--zumrut); }
.amiral-rutbe-satir b { color: var(--fildisi); font: 600 16px var(--kadim-tipi); }
.amiral-yara-rozet { display: inline-flex; align-items: center; padding: 0 7px; border: 1px solid var(--kehribar); border-radius: 999px; color: var(--kehribar); font-size: 11.5px; }

/* ——— Amiral sayfası ——— */
.sayfa-amiral { display: grid; gap: 12px; }
.amiral-ust { display: grid; grid-template-columns: minmax(0, 46%) minmax(0, 1fr); gap: 16px; align-items: start; }
.amiral-resim { position: relative; margin: 0; overflow: hidden; background: radial-gradient(circle at 50% 45%, #13241f, #070b0a 72%); border: 1px solid rgba(67, 211, 145, .45); border-radius: 6px; box-shadow: 0 0 22px rgba(67, 211, 145, .1); }
.amiral-resim img { display: block; width: 100%; height: auto; }
.amiral-resim figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 4px 10px; background: rgba(0, 0, 0, .6); color: #cfe9dc; font: italic 14px var(--kadim-tipi); }
.amiral-kimlik { display: grid; gap: 8px; min-width: 0; }
.amiral-sayfa-ad { margin: 0; color: var(--fildisi); font: 600 30px/1.1 var(--kadim-tipi); letter-spacing: .02em; overflow-wrap: anywhere; }
.amiral-ad-ver > summary { display: inline-flex; align-items: center; gap: 4px; cursor: pointer; color: var(--soluk); font-size: 12px; }
.amiral-ad-ver > summary .simge { width: 14px; height: 14px; }
.amiral-ad-ver[open] > summary { margin-bottom: 6px; }
.amiral-rutbe { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0; font-size: 13px; }
.amiral-rutbe .simge { width: 20px; height: 20px; color: var(--zumrut); }
.amiral-rutbe b { color: var(--zumrut); font: 600 20px var(--kadim-tipi); }
.amiral-tecrube { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; font-size: 12.5px; }
.amiral-yara { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: 0; color: var(--kehribar); font-size: 13px; }
.amiral-yara .simge { width: 16px; height: 16px; }
.amiral-yer { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin: 0; font-size: 13px; }
.amiral-yer .simge { width: 16px; height: 16px; color: var(--zumrut); }
.amiral-ozet { margin: 0; font-size: 12px; }
.amiral-sayilar dd { font-variant-numeric: tabular-nums; }
.amiral-yetenekler { display: grid; gap: 4px; margin: 0; padding: 0; list-style: none; font-size: 13px; }
.amiral-yetenekler li { display: flex; justify-content: space-between; gap: 10px; padding: 3px 0; border-bottom: 1px solid rgba(255, 255, 255, .05); }
.amiral-yetenekler b { color: var(--zumrut); font-variant-numeric: tabular-nums; }
.amiral-parca { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 8px; background: rgba(67, 211, 145, .05); border: 1px solid rgba(67, 211, 145, .25); border-radius: 6px; }
.amiral-parca.takili { border-color: rgba(67, 211, 145, .6); box-shadow: 0 0 10px rgba(67, 211, 145, .12); }
.amiral-parca b { color: var(--fildisi); font: 600 15px var(--kadim-tipi); }
.amiral-parca p { margin: 2px 0 0; font-size: 12px; }
.amiral-parca-simge .simge { width: 22px; height: 22px; color: var(--zumrut); }
.amiral-parcalar { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.amiral-kayitlar { display: grid; gap: 2px; margin: 0; padding: 0; list-style: none; font-size: 12.5px; }
.amiral-kayit { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 2px 10px; align-items: baseline; padding: 4px 0; border-bottom: 1px solid rgba(255, 255, 255, .05); }
.amiral-kayit-sayi { grid-column: 2; }
.amiral-kayit:last-child { border-bottom: 0; }
.amiral-kayit-metin { min-width: 0; overflow-wrap: anywhere; }
.amiral-kayit-metin .simge { width: 14px; height: 14px; vertical-align: -2px; color: var(--zumrut); }
.amiral-kayit-sayi { color: var(--yazi-2); font-size: 12px; font-variant-numeric: tabular-nums; }
.amiral-kayit-sayi b { color: var(--zumrut); }
.amiral-kayit.cekildi .amiral-kayit-metin .simge { color: var(--kehribar); }
.amiral-eski > summary { cursor: pointer; margin-top: 6px; color: var(--yazi-2); font-size: 12.5px; }
@media (max-width: 899px) {
  .amiral-ust { grid-template-columns: 1fr; }
  .amiral-sayfa-ad { font-size: 26px; }
}
@media (max-width: 759px) {
  .amiral-kayit { grid-template-columns: minmax(0, 1fr); }
  .amiral-kayit .not-gunu { justify-self: start; }
  .amiral-kayit-sayi { grid-column: 1; white-space: normal; }
}

/* ——— Tersane: Amiral kartı (Amiral var iken) ——— */
.kart.hal-amiral .kart-resim { box-shadow: 0 0 0 1px rgba(67, 211, 145, .7), 0 0 12px rgba(67, 211, 145, .22); }
.kart-rutbe { position: absolute; top: 3px; left: 3px; z-index: 2; display: inline-flex; align-items: center; gap: 2px; max-width: calc(100% - 6px); padding: 0 4px; overflow: hidden;
  background: rgba(5, 12, 10, .82); border: 1px solid rgba(67, 211, 145, .55); border-radius: 3px; color: #bdf0d6; font-size: 9.5px; font-weight: 600; line-height: 14px; white-space: nowrap; text-overflow: ellipsis; }
.kart-rutbe .simge { width: 10px; height: 10px; }
.kart-yara { position: absolute; top: 19px; left: 3px; z-index: 2; padding: 0 4px; background: rgba(20, 12, 4, .85); border: 1px solid var(--kehribar); border-radius: 3px; color: var(--kehribar); font-size: 9px; line-height: 13px; }
.amiral-eylem { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.amiral-rutbe-rozet { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border: 1px solid rgba(67, 211, 145, .55); border-radius: 999px; color: var(--zumrut); font: 600 14px var(--kadim-tipi); }
.amiral-rutbe-rozet .simge { width: 15px; height: 15px; }
.amiral-eylem .eylem-not { flex-basis: 100%; }

/* ——— Kadim gemi bilgi kartı (pencere) ——— */
.kadim-bilgi-karti { display: grid; grid-template-columns: minmax(0, 42%) minmax(0, 1fr); gap: 14px; }
.kadim-bilgi-resim { position: relative; margin: 0; overflow: hidden; aspect-ratio: 960 / 657; background: radial-gradient(circle at 50% 45%, #13241f, #070b0a 72%); border: 1px solid rgba(67, 211, 145, .4); border-radius: 6px; }
.kadim-bilgi-resim img { width: 100%; height: 100%; object-fit: cover; }
.kadim-bilgi-resim .gemi-yok { width: 34%; height: 34%; margin: 20% auto; display: block; color: #2f5a49; }
.kadim-bilgi-govde { display: grid; gap: 8px; align-content: start; min-width: 0; }
.kadim-bilgi-govde p { margin: 0; }
.kadim-bilgi-ad { margin: 0; color: var(--fildisi); font: 600 24px var(--kadim-tipi); }
@media (max-width: 759px) { .kadim-bilgi-karti { grid-template-columns: 1fr; } }

/* ——— Olay listesi: kehribar bekçi satırı, kadim görevsiz yolculuk, sessiz rozeti ——— */
.olay.bekci { --iliski: var(--kehribar-rgb); --gorev: var(--kehribar-rgb); background: linear-gradient(90deg, rgb(var(--kehribar-rgb) / .1), transparent 70%); }
.olay.bekci .gorev-etiket { border-color: rgb(var(--kehribar-rgb) / .6); color: var(--kehribar); }
.olay.bekci .olay-kim { font-family: var(--kadim-tipi); font-size: 13px; }
.bekci-bilinmez { display: inline-grid; place-items: center; width: 16px; height: 16px; border: 1px solid rgb(var(--kehribar-rgb) / .6); border-radius: 50%; color: var(--kehribar); font-size: 10px; font-weight: 700; }
/* Kadim yolculuk: 4a'nın görevsiz satırının zümrüdü (hikaye.css .olay.gorevsiz), iki uç adıyla */
.olay.kadim-yolculuk { --iliski: 67 211 145; --gorev: 67 211 145; background: linear-gradient(90deg, rgba(67, 211, 145, .08), transparent 70%); }
.olay.kadim-yolculuk .gorev-etiket { background: transparent; border-style: solid; color: var(--zumrut); font-family: var(--kadim-tipi); }
.olay.kadim-yolculuk .olay-yer-ad { font-family: var(--kadim-tipi); font-style: italic; }
/* Yön (gidis/gelis sınıfı yok): kayan simge sağa ilerler; filo simgesi sağa bakar, bekçinin altıgeni düz kalır */
.olay.kadim-yolculuk .yol-simge { transform: rotate(90deg); }
.olay.bekci .yol-filo::before, .olay.kadim-yolculuk .yol-filo::before { right: 100%; }
.sessiz-rozet { display: inline-flex; align-items: center; padding: 0 5px; border: 1px dashed rgba(67, 211, 145, .6); border-radius: 999px; color: #9be3c2; font-size: 10.5px; font-weight: 600; white-space: nowrap; }

/* ——— Galaksi: bekçi nöbeti, bekçi enkazı, kara delik ——— */
.sistem-tablosu tr.kazi-satir.nobetli td { background: linear-gradient(90deg, rgb(var(--kehribar-rgb) / .12), rgba(0, 0, 0, .5)); }
.sistem-tablosu tr.kazi-satir.bekci-enkazi .ad .kes { color: var(--kehribar); }
.bekci-nobet { display: inline-flex; align-items: center; color: var(--kehribar); font-size: 12px; white-space: nowrap; }
.sistem-tablosu tr.kara-delik td { background: rgba(0, 0, 0, .7); }
.sistem-tablosu tr.kara-delik .ad .kes { color: var(--fildisi); font: 600 14px var(--kadim-tipi); }
.sistem-tablosu tr.kara-delik.bekci-toplanma td { background: linear-gradient(90deg, rgb(var(--kehribar-rgb) / .16), rgba(0, 0, 0, .6)); }
.e-gozetle { --e: var(--kehribar); }

/* ——— Filo: kadim grubu, rozet ve ?, sessiz uçuş notu ——— */
.kadim-grubu .filo-grup-adi { color: var(--zumrut); font-family: var(--kadim-tipi); }
.kadim-gemi-filo { position: relative; }
.kadim-gemi-filo .filo-gemi-resim { border-color: rgba(67, 211, 145, .5); }
.kadim-rozet { position: absolute; top: 3px; right: 3px; z-index: 3; padding: 0 4px; background: rgba(5, 12, 10, .82); border: 1px solid rgba(67, 211, 145, .55); border-radius: 3px; color: var(--zumrut);
  font: italic 600 10px/14px var(--kadim-tipi); pointer-events: none; }
.kadim-soru { position: absolute; top: 20px; right: 3px; z-index: 3; display: grid; place-items: center; width: 18px; height: 18px; padding: 0; background: rgba(5, 12, 10, .85);
  border: 1px solid rgba(67, 211, 145, .55); border-radius: 50%; color: var(--zumrut); font-size: 11px; font-weight: 700; }
.sessiz-not { display: flex; align-items: center; gap: 6px; margin: 8px 0 0; color: #9be3c2; font-size: 12.5px; }
.sessiz-not .simge { width: 16px; height: 16px; }

/* ——— Raporlar ——— */
.mesaj-etiket.bekci { border-color: rgb(var(--kehribar-rgb) / .6); color: var(--kehribar); }
.bekci-raporu .rapor-hanedan { color: var(--kehribar); font-family: var(--kadim-tipi); }
.bekci-raporu .bekci-yer { display: grid; place-items: center; color: var(--kehribar); }
.bekci-raporu .bekci-yer .simge { width: 50%; height: 50%; }
.bekci-kume { border-color: rgb(var(--kehribar-rgb) / .3); }
.bekci-kume .rapor-bolum-baslik { flex-wrap: wrap; }
.bekci-savas-ek { margin-top: 8px; }