/* Sayfalar: ana sayfa (bant, manşet, gündem sütunları, buluşma, yakındakiler), başlık sayfası, yer seçimi. Ölçü: önizleme. */

/* Haritalı bant */
.bant{position:relative;background:#1E3A5F;color:#fff;overflow:hidden}
.bant-harita{position:absolute;top:0;right:0;bottom:0;width:58%;z-index:0;background:#2A4466}
.bant-harita .leaflet-tile-pane{filter:grayscale(1) contrast(1.05) brightness(1.04)}
.bant::after{content:'';position:absolute;top:0;bottom:0;right:0;width:58%;z-index:1;pointer-events:none;background:linear-gradient(90deg,#1E3A5F 0%,rgba(30,58,95,.7) 16%,rgba(30,58,95,.15) 42%,transparent 70%)}
.bant-ic{position:relative;z-index:2;padding-top:26px;padding-bottom:84px;pointer-events:none}
.bant-ic a,.bant-ic button,.bant-ic .yer-kutu{pointer-events:auto}
.bant-sol{max-width:640px}
/* Ana sayfa bandı kısa: yer adı ve ölçek tek satırda, altında il, sayılar, son hareket; gündem hemen başlasın */
.bant:not(.ince) .bant-ic{padding-top:22px;padding-bottom:24px}
.bant:not(.ince) .bant-sol{display:flex;flex-wrap:wrap;align-items:center}
.bant:not(.ince) .olcek{margin:0 0 0 18px}
.bant:not(.ince) .yer-ust{width:100%;margin-top:4px}
.bant:not(.ince) .sayilar{margin-top:12px}
.bant:not(.ince) .hareket{width:100%;margin-top:12px}
.yer-satir{position:relative;display:flex;align-items:center;gap:10px}
.bant h1{font-size:40px;font-weight:800;letter-spacing:-.01em}
.yer-ac{display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;font-size:20px;cursor:pointer}
.yer-ac[aria-expanded=true]{background:#fff;color:#1E3A5F}
.olcek{display:inline-flex;gap:4px;margin-top:14px;padding:4px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(255,255,255,.07)}
.olcek button{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border:0;border-radius:9px;background:transparent;color:#fff;font-weight:700;font-size:14px;cursor:pointer}
.olcek button i{font-size:17px}
.olcek button[aria-selected=true]{background:#fff;color:#1E3A5F}
.yer-ust{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:12px 0 0;color:rgba(255,255,255,.86);font-size:15px}
.yer-ust:not(:has(.yer-degis)){flex-wrap:nowrap}
.sayilar{display:inline-grid;grid-template-columns:repeat(3,auto);margin-top:16px;border:1px solid rgba(255,255,255,.16);border-radius:14px;background:rgba(12,26,46,.55)}
.sayilar>div{display:flex;flex-direction:column;justify-content:center;gap:2px;padding:10px 20px;border-left:1px solid rgba(255,255,255,.14)}
.sayilar>div:first-child{border-left:0}
.sayilar small{font-size:12px;color:rgba(255,255,255,.78)}
.sayilar b{font:800 22px/1.1 var(--hf)}
.sayilar .cozulen{flex-direction:row;align-items:center;gap:10px}
.sayilar .cozulen span{display:flex;flex-direction:column;gap:2px}
.kucuk-foto{display:flex}
.kucuk-foto img{width:32px;height:32px;margin-left:-8px;border:2px solid #fff;border-radius:7px;object-fit:cover}
.kucuk-foto img:first-child{margin-left:0}
.hareket{display:flex;align-items:center;gap:8px;max-width:600px;margin:14px 0 0;padding:9px 14px;border-radius:12px;background:rgba(255,255,255,.08);font-size:14px;pointer-events:auto;cursor:pointer}
.hareket:hover{background:rgba(255,255,255,.13)}
.hareket i{font-size:16px;opacity:.85}
.hareket-yazi{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.hareket time{color:rgba(255,255,255,.65);font-size:12.5px;white-space:nowrap}
.canli{position:relative;flex:none;width:10px;height:10px;border-radius:50%;background:#3DDC97;box-shadow:0 0 0 4px rgba(61,220,151,.25)}
/* Canlılık (3 Kasım, kullanıcı isteği; önizlemedeki tasarım): canlı nokta dalgalanır, son hareketler dönerek akar */
.canli::after{content:'';position:absolute;inset:-5px;border-radius:50%;border:2px solid #3DDC97;opacity:0;animation:av-dalga 2.4s ease-out infinite}
.hareket-liste{position:relative;flex:1;min-width:0;height:22px;margin:0;padding:0;list-style:none;overflow:hidden}
.hareket-liste li{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(100%);transition:opacity .45s ease,transform .45s ease,visibility 0s .45s}
.hareket-liste li.on{opacity:1;visibility:visible;transform:none;transition:opacity .45s ease,transform .45s ease,visibility 0s}
.hareket-liste a{display:flex;align-items:center;gap:8px;height:100%;color:inherit;text-decoration:none}
.hareket-liste a:hover .hareket-yazi{text-decoration:underline;text-underline-offset:3px}
.hareket-liste li.cik{opacity:0;transform:translateY(-100%)}
.harita-ac{display:none}
.bant.ince .bant-ic{padding-bottom:28px}
.bant.ince h1{font-size:32px}
.yer-degis{display:inline-flex;align-items:center;gap:6px;height:32px;margin-left:8px;padding:0 12px;border:1px solid rgba(255,255,255,.4);border-radius:999px;background:transparent;color:#fff;font-weight:700;font-size:13.5px;cursor:pointer}
.geri{display:inline-flex;align-items:center;gap:6px;margin-top:14px;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.13);color:#fff;font-weight:700;font-size:14px;text-decoration:none}

/* Sayfa düzeni: solda gündem, sağda dar sütun */
.duzen{position:relative;z-index:3;display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:22px;align-items:start;margin-top:-58px;padding-bottom:48px}
.duzen>.sutunlar{grid-column:1;grid-row:1}
.duzen>.yan{grid-column:2;grid-row:1;display:flex;flex-direction:column;gap:22px}
/* Ana sayfa: üç sütun aynı hizada başlar, aynı hizada biter */
#duzen{align-items:stretch;margin-top:20px}
#duzen>.yan>:last-child{flex:1}
.ana-ekran{display:none;align-items:center;gap:12px;padding:14px 14px 14px 16px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge)}
.ana-ekran>div{flex:1;min-width:0}
.ana-ekran b,.ana-ekran small{display:block}
.ana-ekran small{color:var(--mut);font-size:13px}
.ae-ik{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:12px;background:var(--soft-acc);color:var(--acc);font-size:22px}
.ae-kapat{display:grid;place-items:center;flex:none;width:32px;height:32px;margin-left:-4px;border:0;border-radius:50%;background:none;color:var(--mut);font-size:18px;cursor:pointer}
.baslik-duzen{margin-top:24px}
.baslik-duzen>.yan{grid-row:1}

.sira{position:absolute;top:14px;left:14px;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#fff;color:#0F172A;font:800 18px var(--hf);box-shadow:0 2px 8px rgba(0,0,0,.2)}

/* Gündem sütunları */
.sutunlar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;align-items:stretch}
.sutunlar.tek{grid-template-columns:minmax(0,1fr)}
.tlf-sec{display:none}
.kutu{display:flex;flex-direction:column;min-width:0;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge-b);overflow:hidden;scroll-margin-top:76px}
.kutu-ust{display:flex;align-items:center;gap:12px;padding:16px 18px;color:#fff}
.kutu-ust.kirmizi{background:#C62828}
.kutu-ust.lacivert{background:#1E3A5F}
.kutu-ust h2{font-size:22px;font-weight:800;white-space:nowrap}
.kutu-ust p{margin:0;font-size:13.5px;opacity:.85}
.kutu-ik{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:13px;background:rgba(255,255,255,.15);font-size:25px}
.kutu-btn{display:inline-flex;align-items:center;gap:6px;flex:none;height:40px;margin-left:auto;padding:0 16px;border:0;border-radius:10px;background:#fff;font-weight:800;font-size:14.5px;cursor:pointer}
.kutu-btn i{font-size:18px}
.kirmizi .kutu-btn{color:#C62828}
.lacivert .kutu-btn{color:#1E3A5F}
.kutu-btn .tlf{display:none}
/* Sekmeler tek görünümde ("Fotoğraflı / Yazılı" ile aynı): önceden aynı iş için dört ayrı sekme tasarımı vardı */
.sekmeler{display:flex;gap:4px;margin:12px 14px;padding:4px;border-radius:12px;background:var(--soft)}
.sekmeler button{display:inline-flex;flex:1 1 auto;align-items:center;justify-content:center;gap:6px;height:36px;padding:0 8px;border:0;border-radius:9px;background:transparent;color:var(--ink2);font-weight:700;font-size:14px;white-space:nowrap;cursor:pointer}
.tlf-sec button{display:inline-flex;align-items:center;gap:6px;height:36px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:var(--kart);color:var(--ink);font-weight:700;font-size:14px;cursor:pointer}
.sekmeler button i{font-size:16px}
.foto-kutu .sekmeler button i{display:none}   /* dört sekme (En yeni ile) tek satıra sığsın; yazılı sekmeler simgeli kalır */
.sekmeler button[aria-selected=true]{background:var(--kart);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.tlf-sec button[aria-selected=true]{border-color:var(--btn);background:var(--btn);color:#fff}
.tlf-sec button[data-tlf=foto][aria-selected=true]{border-color:#C62828;background:#C62828}
.sekmeler em,.tlf-sec em{min-width:20px;padding:0 6px;border-radius:10px;background:var(--line);color:var(--ink2);font-size:12px;font-style:normal;text-align:center}
.sekmeler [aria-selected=true] em{background:var(--soft-acc);color:var(--acc)}
.tlf-sec em{background:var(--soft)}
.tlf-sec [aria-selected=true] em{background:rgba(255,255,255,.2);color:#fff}
.fk-izgara{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;padding:4px 16px 16px}
/* Her sütunda 1 numara büyük */
.fk.bir{grid-column:1/-1}
.fk.bir .fk-foto{aspect-ratio:16/9}
.fk.bir .fk-foto .sira{top:12px;left:12px;width:46px;height:46px;font-size:21px}
.fk.bir .fk-ic h3{min-height:0;font-size:23px}
.fk-ozet{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:2px 0;color:var(--ink2);font-size:14.5px;line-height:1.45}
.fk.bir .fk-alt{gap:8px}
.fk.bir .oy-btn:not(.kare){flex:1;justify-content:center;height:44px;border-color:var(--btn);background:var(--btn);color:#fff}
.fk.bir .oy-btn.secili:not(.kare){border-color:#0E7A4B;background:#0E7A4B}
.fk.bir .oy-btn:not(.kare) b{padding:0 8px;border-radius:999px;background:rgba(255,255,255,.18);font-size:14px}
.fk.bir .oy-btn.kare{width:44px;height:44px}
.fk{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:16px;background:var(--kart);overflow:hidden}
/* Bütün kartlarda fotoğraf aynı boyda: dikey fotoğraf kartı uzatıp sırayı bozuyordu */
.fk-foto{position:relative;display:block;aspect-ratio:4/3;background:var(--soft)}
.fk-foto img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fk-foto .sira{top:10px;left:10px;width:32px;height:32px;font-size:15px}
.fk-foto .rozet{position:absolute;left:10px;bottom:10px;box-shadow:0 1px 4px rgba(0,0,0,.15)}
.fk-foto .rozet.benim{left:auto;bottom:auto;top:10px;right:10px}
.fk-ic{display:flex;flex-direction:column;flex:1;gap:4px;padding:12px 14px 14px}
/* Başlık iki satırda sabit: kartlar aynı boyda dizilsin */
.fk-ic h3{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:2.5em;font-size:16.5px;font-weight:800;line-height:1.25}
.fk-ic h3 a{text-decoration:none}
.fk-alt{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:10px}
.oy-btn{display:inline-flex;align-items:center;gap:6px;height:38px;padding:0 14px;border:1px solid var(--line);border-radius:10px;background:var(--kart);color:var(--acc);font-weight:800;cursor:pointer}
.oy-btn b{font-size:16px}
.oy-btn.kare{justify-content:center;width:38px;padding:0;color:var(--mut)}
.kutu-harita{height:440px;background:var(--soft)}
.yl{margin:0;padding:0 16px;list-style:none}
.yl li{position:relative;border-bottom:1px solid var(--line)}
.yl li:last-child{border-bottom:0}
.yl-sat{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:center;padding:16px 80px 16px 0;color:inherit;text-decoration:none}
.yl-no{font:800 24px var(--hf);color:var(--ink2);text-align:center}
.yl-ic{display:flex;flex-direction:column;min-width:0}
.yl-bas{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.yl-bas b{font-size:16.5px;font-weight:800;line-height:1.3}
.yeni{display:inline-flex;align-items:center;flex:none;gap:3px;padding:2px 8px;border-radius:999px;background:var(--soft);color:var(--ink2);font-size:11.5px;font-weight:700}
.ozet{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;margin-top:3px;color:var(--ink2);font-size:14px}
.yl .meta{margin-top:6px}
.artis{color:var(--ink);font-weight:700}
.yl-oy{position:absolute;top:50%;right:0;display:grid;place-items:center;width:62px;padding:8px 0;border:1px solid var(--line);border-radius:14px;background:var(--kart);color:var(--acc);transform:translateY(-50%);cursor:pointer}
.yl-oy i{font-size:20px}
.yl-oy b{font:800 18px/1.1 var(--hf)}
.yl li.bir .yl-sat{grid-template-columns:38px minmax(0,1fr);padding:14px 90px 18px 0}
.yl li.bir .yl-no{color:var(--acc);font-size:42px}
.yl li.bir .yl-bas b{font:800 22px/1.2 var(--hf)}
.yl li.bir .ozet{-webkit-line-clamp:3;font-size:15px;line-height:1.45}
.yl li.bir .yl-oy{width:74px;padding:12px 0;border-color:var(--btn);background:var(--btn);color:#fff}
.yl li.bir .yl-oy.secili{border-color:#0E7A4B;background:#0E7A4B}
.yl li.bir .yl-oy b{font-size:22px}
/* Kısa kalan sütunda boşluk yerine davet (yer yoksa görünmez); sayfalayıcı kutunun dibinde */
.kutu-dolgu{flex:1 1 0;min-height:0;container-type:size}
.kutu-dolgu>div{display:none;align-content:center;justify-items:center;gap:6px;height:100%;padding:14px 20px;border-top:1px solid var(--line);color:var(--ink2);text-align:center}
.kutu-dolgu i{color:var(--mut);font-size:26px}
.kutu-dolgu b{color:var(--ink);font:800 16px var(--hf)}
.kutu-dolgu small{font-size:13.5px}
.kutu-dolgu .btn{margin-top:4px}
.kutu-dolgu .btn i{color:inherit;font-size:17px}
@container (min-height:150px){.kutu-dolgu>div{display:grid}}
.sayfalayici{display:flex;align-items:center;justify-content:center;gap:14px;padding:12px;border-top:1px solid var(--line);color:var(--ink2);font-weight:700}
.sayfalayici button{display:grid;place-items:center;width:42px;height:42px;border:1px solid var(--line2);border-radius:11px;background:var(--kart);color:var(--ink);font-size:21px;cursor:pointer}
.sayfalayici button:disabled{opacity:.35;cursor:default}

/* Vatandaş Buluşması kartı */
.bulusma-kart{padding:18px;border:1px solid #F1DFB4;border-radius:var(--r);background:linear-gradient(180deg,#FFF9EC,#FFF3DC);box-shadow:var(--golge);color:#2B2410}
.bk-ust{display:flex;gap:12px}
.bk-el{flex:none;width:58px;height:58px;padding:6px;border-radius:14px;background:#fff;object-fit:contain;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.bulusma-kart h2{font-size:19px;font-weight:800}
.bk-ust p,.bulusma-kart.bos p{display:flex;align-items:flex-start;gap:6px;margin:4px 0 0;color:#4A3F22;font-size:14px}
.bk-ust p i{margin-top:2px;color:#8A5A00}
.bk-geri{display:flex;align-items:center;justify-content:space-between;margin:14px 0 10px;padding:10px 14px;border-radius:12px;background:#FFEDC2;color:#7A4B00}
.bk-geri span{font-size:13px}
.bk-geri b{font:800 20px var(--hf)}
.bk-koltuk{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 12px;font-size:13.5px}
.bk-koltuk>span:last-child{white-space:nowrap}
.bk-koltuk .noktalar{gap:4px}
.bk-koltuk .noktalar span{width:20px;height:20px;margin-left:0;border:0;background:#E9DFC9}
.bk-koltuk .noktalar span.dolu{background:var(--yesil)}
.bk-kucuk{margin:0 0 6px;color:#6B5F43;font-size:12.5px}
.bk-konu{display:flex;gap:8px;margin-bottom:14px}
.bk-konu a{position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:10px;background:#fff;overflow:hidden}
.bk-konu img{width:100%;height:100%;object-fit:cover}
.bk-konu .no{position:absolute;top:3px;left:3px;display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#fff;color:#0F172A;font:800 11px var(--hf)}
.ik-kare i{font-size:24px;color:#1E3A5F}
.bulusma-kart .btn.ana{background:#1E3A5F}
.bk-alt{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:12px;padding-top:12px;border-top:1px dashed #E8D3A4;color:#8A5A00;font-size:13.5px}
.bk-alt span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.bk-alt .btn{padding:0 10px;white-space:nowrap}
.bulusma-kart .btn.cizgi{border-color:#E2C68A;background:#fff;color:#8A5A00}
.bulusma-kart.bos .bk-el{margin-bottom:10px}
.bulusma-kart.bos .btn{margin-top:14px}
html[data-tema=gece] .bulusma-kart,html[data-tema=gece] .davet{border-color:#4A3D1C;background:linear-gradient(180deg,#2A2414,#211C0F);color:#F3EBD6}
html[data-tema=gece] .bk-ust p,html[data-tema=gece] .bulusma-kart.bos p{color:#E1D6B8}
html[data-tema=gece] .bk-geri{background:#3A2E10;color:#F3D98B}
html[data-tema=gece] .bk-kucuk,html[data-tema=gece] .bk-alt{color:#D9C38C}
html[data-tema=gece] .bk-koltuk .noktalar span{background:#4A3D1C}

/* Yan kart: yakındakiler */
.yan-kart{padding:18px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge)}
.yan-kart h2{font-size:18px;font-weight:800}
.alt-yazi{margin:2px 0 12px;color:var(--mut);font-size:13.5px}
.ikili{display:grid;grid-template-columns:1fr 1fr;margin-bottom:12px;padding:4px;border-radius:12px;background:var(--soft)}
.ikili button{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:36px;border:0;border-radius:9px;background:transparent;color:var(--ink2);font-weight:700;font-size:14px;cursor:pointer}
.ikili button[aria-selected=true]{background:var(--kart);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.1)}
.yakin-liste{display:grid;gap:12px;margin:0;padding:0;list-style:none}
.yakin-liste a{display:flex;gap:12px;color:inherit;text-decoration:none}
.yakin-liste img,.yk-ik{display:grid;place-items:center;flex:none;width:96px;height:68px;border-radius:10px;background:var(--soft);object-fit:cover}
.yk-ik i{font-size:24px;color:var(--mut)}
.yakin-liste b{display:block;font-size:15px;font-weight:800;line-height:1.25}
.yakin-liste small{display:flex;align-items:center;gap:4px;margin-top:3px;color:var(--mut);font-size:12.5px}

/* Başlık sayfası */
.bk{grid-column:1;display:grid;grid-template-columns:minmax(0,1fr) 300px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge);overflow:hidden}
.bk-sol{padding:28px 30px}
.bk-sag{display:flex;flex-direction:column;gap:10px;padding:24px;border-left:1px solid var(--line);background:linear-gradient(180deg,var(--soft),transparent 55%)}
.bk-sol>.bk-ust{display:flex;align-items:center;justify-content:space-between}
.sira-yazi{color:var(--mut);font-size:13px;font-weight:700}
.paylas{display:flex;gap:8px}
.paylas button,.paylas a{display:grid;place-items:center;width:38px;height:34px;border:1px solid var(--line);border-radius:10px;background:var(--kart);color:var(--ink2);font-size:18px;text-decoration:none;cursor:pointer}
.paylas .wa{color:#128C4A}
.bk-baslik{margin:12px 0 10px;font-size:34px;font-weight:800;line-height:1.15}
.yazan{display:flex;align-items:center;gap:8px;margin:0;color:var(--mut);font-size:14px}
.yazan b{color:var(--ink)}
.bk-fotolar{display:grid;gap:10px;margin-top:18px}
.bk-fotolar.iki{grid-template-columns:repeat(2,minmax(0,1fr))}
.bk-fotolar.iki img{aspect-ratio:4/3}
/* Çözüm fotoğrafı yeri (4 Kasım, kullanıcı): resmin sağında ince sütun; fotoğraf gelince iki kutu eşit olur */
.bk-fotolar.yuva{grid-template-columns:minmax(0,1fr) 84px}
.bk-cozum-yeri{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px 6px;border:2px dashed color-mix(in srgb,var(--yes) 50%,var(--line));border-radius:14px;background:var(--yes-a);color:var(--yes);font-weight:800;font-size:14px;line-height:1.2;cursor:pointer}
.bk-cozum-yeri:hover{border-style:solid}
.bk-cozum-yeri i{font-size:28px}
.bk-cozum-yeri span{writing-mode:vertical-rl;transform:rotate(180deg)}
.bk-fotolar figure{position:relative;margin:0}
.bk-fotolar img{width:100%;max-height:440px;border-radius:14px;object-fit:cover}
.bk-fotolar img:not([src]){aspect-ratio:4/3;background:var(--soft)}
.bk-fotolar figcaption{position:absolute;top:10px;left:10px;padding:3px 10px;border-radius:999px;background:rgba(15,23,42,.75);color:#fff;font-size:12.5px;font-weight:700}
.bk-metin{margin:20px 0 0;font-size:16.5px;line-height:1.65}
.durum-kutu{margin-top:24px;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--soft)}
.dk-ust{display:flex;align-items:center;justify-content:space-between}
.dk-ust h2{font-size:20px;font-weight:800}
.adimlar{display:grid;grid-template-columns:repeat(4,1fr);margin:18px 0 6px;padding:0;list-style:none}
.adimlar li{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--mut);font-size:13.5px;text-align:center}
.adimlar li::before{content:'';position:absolute;top:9px;left:-50%;width:100%;height:2px;background:var(--line2)}
.adimlar li:first-child::before{display:none}
.adimlar li span{position:relative;z-index:1;width:20px;height:20px;border:2px solid var(--line2);border-radius:50%;background:var(--kart)}
.adimlar li.gecti::before,.adimlar li.simdi::before{background:var(--btn)}
.adimlar li.gecti span{border-color:var(--btn);background:var(--btn)}
.adimlar li.simdi{color:var(--ink);font-weight:800}
.adimlar li.simdi span{width:26px;height:26px;margin-top:-3px;border:3px solid var(--btn)}
.gelismeler{display:grid;gap:14px;margin:14px 0;padding:0 0 0 14px;border-left:2px solid var(--line2);list-style:none}
.gelismeler b{font-size:15px}
.gelismeler p{margin:2px 0;color:var(--ink2);font-size:14.5px}
.gelismeler small{color:var(--mut);font-size:12.5px}
.dk-yazi{margin:14px 0;color:var(--ink2)}
.dk-not{margin:12px 0 0;color:var(--mut);font-size:12.5px;line-height:1.5}
.yorumlar{margin-top:28px}
.yorumlar h2{display:flex;align-items:center;gap:8px;font-size:22px;font-weight:800}
.sayac{padding:1px 9px;border-radius:999px;background:var(--soft);color:var(--ink2);font:700 13px var(--ff)}
.yorumlar ul{margin:14px 0 0;padding:0;list-style:none}
.yorumlar li{display:flex;gap:12px;padding:14px 0;border-bottom:1px solid var(--line)}
.yorumlar li>div{flex:1;min-width:0}
.y-ust{display:flex;align-items:baseline;gap:8px;margin:0}
.y-ust span{color:var(--mut);font-size:13px}
.y-metin{margin:4px 0 6px;font-size:15.5px;line-height:1.55}
.y-alt{display:flex;gap:14px;margin:0}
.y-alt button{display:inline-flex;align-items:center;gap:4px;padding:4px 0;border:0;background:none;color:var(--mut);font-size:13.5px;font-weight:700;cursor:pointer}
.kucuk-yazi{margin:10px 0;color:var(--mut);font-size:13px}
.yorum-yaz{display:flex;align-items:center;gap:10px;margin-top:14px;padding:8px 8px 8px 12px;border:1px solid var(--line);border-radius:16px;background:var(--kart)}
.yorum-yaz input{flex:1;min-width:0;height:40px;border:0;background:transparent;outline:0}
.bk-etiket{margin:0;color:var(--mut);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}
.bk-sayi{margin:0;color:var(--acc);font:800 48px/1 var(--hf)}
.bk-oran{margin:0;color:var(--ink2);font-size:14px}
.bk-cubuk{height:8px;border-radius:999px;background:var(--line);overflow:hidden}
.bk-cubuk span{display:block;height:100%;background:var(--yesil)}
.resmi{margin-top:6px;padding:16px;border-radius:16px;background:#1E3A5F;color:#fff}
.resmi-etiket{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:999px;background:#fff;color:#1E3A5F;font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.resmi h3{margin:10px 0 6px;font-size:17px}
.resmi-sat{display:flex;align-items:center;gap:10px;padding:8px 0}
.resmi-sat>i{font-size:24px;opacity:.9}
.resmi-sat span{flex:1}
.resmi-sat b{display:block;font-size:14px}
.resmi-sat small{font-size:12.5px;opacity:.75}
.resmi-sat button{height:36px;padding:0 14px;border:1px solid rgba(255,255,255,.45);border-radius:10px;background:transparent;color:#fff;font-weight:800;cursor:pointer}
.davet>div{flex:1;min-width:140px}
.davet .btn{width:100%}
.davet{display:flex;flex-wrap:wrap;align-items:center;gap:10px;padding:14px;border:1px solid #F1DFB4;border-radius:16px;background:linear-gradient(180deg,#FFF9EC,#FFF4DE);color:#2B2410}
.davet img{flex:none;width:44px;height:44px;object-fit:contain}
.davet b{display:block;font-size:14.5px}
.davet p{margin:2px 0 0;font-size:12.5px;opacity:.85}
.alt-oy{display:none}

/* Yer seçimi */
.yer-kutu{position:absolute;top:calc(100% + 8px);left:0;z-index:30;display:grid;gap:10px;width:min(360px,calc(100vw - 32px));padding:14px;border-radius:16px;background:var(--kart);color:var(--ink);box-shadow:0 12px 40px rgba(15,23,42,.28);font-size:15px}
.ys-ara{display:flex;align-items:center;gap:8px;height:42px;padding:0 12px;border:1px solid var(--line);border-radius:12px;color:var(--mut)}
.ys-ara input{flex:1;min-width:0;border:0;background:transparent;color:var(--ink);outline:0}
.ys-sonuc{max-height:240px;margin:0;padding:0;overflow:auto;list-style:none}
.ys-sonuc:empty{display:none}
.ys-sonuc button{display:flex;flex-direction:column;align-items:flex-start;width:100%;padding:8px 10px;border:0;border-radius:10px;background:none;text-align:left;cursor:pointer}
.ys-sonuc button:hover,.ys-sonuc button:focus-visible{background:var(--soft)}
.ys-sonuc small,.ys-kendi small{color:var(--mut);font-size:12.5px}
.ys-yok{padding:8px 10px;color:var(--mut)}
.ys-kendi{display:flex;align-items:center;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--soft);text-align:left;cursor:pointer}
.ys-kendi i{font-size:20px;color:var(--acc)}
.ys-kendi b,.ys-kendi small{display:block}
.ys-sec{display:grid;gap:8px}
.ys-sec label{display:grid;gap:4px;color:var(--ink2);font-size:12.5px;font-weight:700}
.ys-sec select{height:40px;padding:0 10px;border:1px solid var(--line);border-radius:10px;background:var(--kart);color:var(--ink)}
.bant.ince .yer-kutu{top:calc(100% + 4px)}
.bant.ys-acik{overflow:visible;z-index:40}

/* Harita işaretleri */
.harita-bulusma img{box-sizing:border-box;width:40px;height:40px;padding:4px;border:3px solid #fff;border-radius:50%;background:#FFE7A8;box-shadow:0 3px 10px rgba(0,0,0,.35)}
/* Noktalar (ölçü önizlemedeki "mahallenin nabzı"): beyaz çerçeveli; açık kırmızı, iletilen turuncu, çözülen yeşil.
   Öndeki üç açık dert, son hareketlerdeki yeşil canlı nokta gibi sinyal yayar (3 Kasım, kullanıcı isteği); ötekiler sakin durur.
   Hepsi yanıp sönünce harita kırmızı bir yığına dönüyordu. Yaklaşan buluşmanın yeri de nabız gibi atar. */
.av-pin-kap{background:none;border:0}
.av-pin{position:relative;display:block;width:30px;height:30px;color:#C62828}
.av-pin.ilet{color:#C2560C}
.av-pin.coz{color:#12905A}
.av-pin i{position:absolute;inset:5px;border-radius:50%;border:2.5px solid #fff;background:currentColor;box-shadow:0 2px 6px rgba(0,0,0,.35)}
.bant-harita .av-pin i{inset:7px;border-width:2px}
.av-pin.sinyal::after{content:'';position:absolute;inset:0;border-radius:50%;border:3px solid currentColor;opacity:0;animation:av-dalga 2s ease-out infinite}
.harita-bulusma.nabiz::before{content:'';position:absolute;inset:-2px;z-index:-1;border-radius:50%;border:3px solid #F2B23A;opacity:0;animation:av-dalga 2.6s ease-out infinite}
@keyframes av-dalga{0%{opacity:.85;transform:scale(.6)}100%{opacity:0;transform:scale(1.9)}}
@media (prefers-reduced-motion:reduce){
  .canli::after,.av-pin.sinyal::after,.harita-bulusma.nabiz::before{animation:none}
  .hareket-liste li{transition:none}
}
.harita-resmi{display:grid;place-items:center;box-sizing:border-box;border:3px solid #1E3A5F;border-radius:50%;background:#fff;color:#1E3A5F;font-size:16px;box-shadow:0 2px 8px rgba(0,0,0,.3)}
.leaflet-container{font:12px var(--ff)}

/* Uzun sayfada yan sütunlar ekranla birlikte iner, sağ taraf boş kalmasın (başlık, buluşmalar, pano) */
@media (min-width:861px){
  .duzen:not(#duzen)>.yan{position:sticky;top:84px}
  .bk{overflow:clip}
  .bk-sol{border-right:1px solid var(--line)}
  .bk-sag{position:sticky;top:76px;align-self:start;border-left:0}
}
/* Dar masaüstü ve tablet: yan sütun gündemin altına, yan yana; simge yer kaplamasın */
@media (max-width:1280px){
  .kutu-ik{display:none}
}
@media (max-width:1120px) and (min-width:861px){
  #duzen{grid-template-columns:minmax(0,1fr)}
  #duzen>.yan{grid-column:1;grid-row:2;flex-direction:row;align-items:stretch}
  #duzen>.yan>*{flex:1;min-width:0}
  .baslik-duzen{grid-template-columns:minmax(0,1fr)}
  .baslik-duzen>.yan{position:static;grid-column:1;grid-row:auto}
}

/* Telefon */
@media (max-width:860px){
  .bant{background:transparent;overflow:visible}
  .bant-harita{position:relative;width:100%;height:190px}
  .bant::after{display:none}
  .bant-ic{margin-top:-22px;padding:20px 16px 22px;border-radius:22px 22px 0 0;background:#1E3A5F}
  .bant:not(.ince) .bant-ic{padding:20px 16px 16px}
  .bant:not(.ince) .yer-ust{order:1;margin-top:2px}
  .bant:not(.ince) .olcek{order:2;margin:10px 0 0}
  .bant:not(.ince) .sayilar{order:3;margin-top:10px}
  .bant:not(.ince) .hareket{order:4;margin-top:10px}
  .bant h1{font-size:32px}
  .harita-ac{position:absolute;top:136px;right:12px;z-index:3;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 12px;border-radius:999px;background:#fff;color:#0F172A;font-size:13px;font-weight:700;text-decoration:none;box-shadow:0 2px 8px rgba(0,0,0,.2)}
  .olcek{display:flex;width:100%}
  .olcek button{flex:1;justify-content:center;padding:0 8px}
  .sayilar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%}
  .sayilar>div{justify-content:space-between;padding:9px 10px}
  .sayilar .cozulen{align-items:stretch}
  .sayilar .cozulen span{flex:1;justify-content:space-between}
  .sayilar small{font-size:11.5px;line-height:1.2}
  .sayilar b{font-size:18px}
  .sayilar .kucuk-foto{display:none}
  .bant.ince .bant-harita{height:120px}
  .bant.ince .bant-ic{padding-bottom:20px}
  .bant.ince h1{font-size:26px}
  .yer-degis{margin-left:0}
  .duzen{display:flex;flex-direction:column;align-items:stretch;gap:16px;margin-top:16px;padding-bottom:24px}
  .duzen>*,.duzen>.yan>*{min-width:0}
  .duzen>.yan{display:contents}
  .ana-ekran{order:4;display:flex}
  .sutunlar{order:1;display:block}
  .bulusma-kart,.bulusma-kart.bos{order:2}
  .yan-kart{order:3}
  #duzen{margin-top:16px}
  #duzen>.yan>:last-child{flex:none}
  .kutu-dolgu{display:none}
  .fk.bir .fk-foto{aspect-ratio:16/10}
  .kutu-ust h2{font-size:22px}
  .tlf-sec{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
  .sekmeler{margin:10px 12px}
  .sekmeler button{padding:0 5px;font-size:13.5px}
  .sekmeler button i{display:none}
  .tlf-sec button{justify-content:center;height:46px;border-radius:14px;font-size:15.5px}
  .sutunlar[data-tlf=foto] .yazili-kutu,.sutunlar[data-tlf=yazili] .foto-kutu{display:none}
  /* Telefonda başlık sekmede yazar, kutunun üstünde yalnız ana düğme kalır (Başlık Aç telefonda hiç görünmüyordu) */
  .sutunlar .kutu-ust{padding:12px 14px 0;background:none;color:var(--ink)}
  .sutunlar .kutu-ik,.sutunlar .kutu-ust h2{display:none}
  .sutunlar .kutu-ust p{color:var(--ink2);font-size:14px;font-weight:700;opacity:1}
  .sutunlar .kirmizi .kutu-btn{background:#C62828;color:#fff}
  .sutunlar .lacivert .kutu-btn{background:var(--btn);color:#fff}
  .kutu-harita{height:360px}
  .bk{grid-template-columns:minmax(0,1fr)}
  .bk-sol{padding:18px}
  .bk-sag{border-top:1px solid var(--line);border-left:0}
  .bk-baslik{font-size:28px}
  .bk-fotolar.yuva{grid-template-columns:minmax(0,1fr) 66px}
  .bk-cozum-yeri{font-size:13px}
  .baslik-duzen{margin-top:16px}
  body[data-sayfa=baslik]{padding-bottom:calc(68px + env(safe-area-inset-bottom))}
  .alt-oy{position:fixed;left:0;right:0;bottom:0;z-index:45;display:flex;gap:8px;padding:10px 12px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--line);background:var(--ust)}
  .alt-oy .btn.ana{flex:1}
  .alt-oy .btn b{padding:1px 8px;border-radius:999px;background:rgba(255,255,255,.18)}
  .oy-kare{display:grid;place-items:center;width:48px;height:44px;border:1px solid var(--line);border-radius:12px;background:var(--kart);color:var(--ink2);font-size:20px;text-decoration:none;cursor:pointer}
  .oy-kare.wa{border-color:#16A34A;background:#16A34A;color:#fff}
}
@media (max-width:560px){
  /* Telefonda iki sütun: kart başına 380 piksel yerine 240, uzun kaydırma biter */
  .fk-izgara{gap:10px;padding:12px}
  .fk-ic{padding:9px 10px 11px}
  .fk-ic h3{font-size:14.5px}
  .fk.bir .fk-ic h3{font-size:21px}
  .fk-ic .meta{font-size:12px}
  .fk-ic .meta i{display:none}
  .fk-foto .sira{top:7px;left:7px;width:26px;height:26px;font-size:12.5px}
  .fk-alt{padding-top:8px}
  .oy-btn{height:34px;padding:0 9px}
  .oy-btn.kare{width:34px}
  .adimlar li{font-size:12px}
}

/* Katkı durumları (aşama 3): seçili oy, kendi başlığın, kendi yorumun */
.btn.ana.secili,.alt-oy .btn.ana.secili{background:#0E7A4B}
.btn.secili-karsi,.oy-kare.secili-karsi{border-color:var(--kir)!important;background:var(--kir-a)!important;color:var(--kir)!important}
.oy-btn.secili,.yl-oy.secili{border-color:var(--btn);background:var(--btn);color:#fff}
.oy-btn.kare.secili{border-color:var(--kir);background:var(--kir-a);color:var(--kir)}
.oy-btn:disabled,.yl-oy:disabled,.btn:disabled{opacity:.6;cursor:wait}
.btn.cizgi.tehlike{border-color:color-mix(in srgb,#B42318 35%,transparent);background:var(--kart);color:#B42318}
html[data-tema=gece] .btn.cizgi.tehlike{color:#FF8A80}
.bk-kendi{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0 0;padding:8px 10px;border:1px dashed var(--line2);border-radius:12px}
.bk-kendi-etiket{display:inline-flex;align-items:center;gap:6px;margin-right:auto;color:var(--ink2);font-size:13.5px;font-weight:700}
.bk-kendi-etiket i{color:var(--yesil);font-size:18px}
.bk-kendi-not{color:var(--mut);font-size:13px}
.bk-sag .bk-kendi-not{margin:4px 0 0;line-height:1.45}
.durum-kutu [data-takip].secili{border-color:var(--yes);background:var(--yes-a);color:var(--yes)}
.y-ust .sen{padding:0 7px;border-radius:999px;background:var(--soft-acc);color:var(--acc);font-size:11.5px;font-weight:800}
.y-alt .secili{color:var(--acc)}
.y-alt .tehlike{color:#B42318}
html[data-tema=gece] .y-alt .tehlike{color:#FF8A80}
.y-say{display:inline-flex;align-items:center;gap:4px;padding:4px 0;color:var(--mut);font-size:13.5px;font-weight:700}
.alt-oy a.btn.ana{flex:1}

/* Fotoğrafla bildir (aşama 4) */
.bd-adim{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 14px;padding:0;list-style:none}
.bd-adim li{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 6px;border-radius:10px;background:var(--soft);color:var(--mut);font-size:13.5px;font-weight:700}
.bd-adim li.simdi{background:var(--btn);color:#fff}
.bd-adim li.gecti{background:var(--yes-a);color:var(--yes)}
.bd-durum{display:flex;align-items:center;gap:8px;margin:0 0 12px;padding:12px 14px;border-radius:12px;background:var(--soft);font-size:14.5px}
.bd-durum.ok{background:var(--yes-a);color:var(--yes)}
.bd-durum .ti-loader-2{animation:don 1s linear infinite}
.bd-cek{display:flex;align-items:center;justify-content:center;gap:10px;height:120px;border:2px dashed var(--line2);border-radius:16px;background:var(--soft);color:var(--acc);font-weight:800;font-size:17px;cursor:pointer}
.bd-cek i{font-size:30px}
.bd-cek input{position:absolute;width:1px;height:1px;opacity:0}
.bd-cek:focus-within{outline:2px solid var(--acc);outline-offset:2px}
.bd-onizleme{width:100%;max-height:260px;margin-bottom:12px;border-radius:14px;object-fit:cover}
.bd-turler{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0 0 12px;padding:0;border:0}
.bd-turler legend{margin-bottom:6px;color:var(--ink2);font-size:13.5px;font-weight:700}
.bd-turler label{cursor:pointer}
.bd-turler input{position:absolute;opacity:0}
.bd-turler span{display:flex;align-items:center;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;font-weight:700;font-size:14px}
.bd-turler span i{font-size:19px;color:var(--ink2)}
.bd-turler input:checked+span{border-color:var(--btn);background:var(--soft-acc)}
.bd-turler input:focus-visible+span{outline:2px solid var(--acc);outline-offset:2px}
.bk-hazirlaniyor{display:flex;align-items:center;gap:12px;margin-top:18px;padding:22px;border:1px dashed var(--line2);border-radius:14px;background:var(--soft)}
.bk-hazirlaniyor>i{font-size:26px;color:var(--acc);animation:don 1s linear infinite}
.bk-hazirlaniyor b,.bk-hazirlaniyor small{display:block}
.bk-hazirlaniyor small{color:var(--mut)}
.bk-gizlilik{display:flex;align-items:center;gap:6px;margin:8px 0 0;color:var(--mut);font-size:13px}
.bk-gizlilik i{color:var(--yes);font-size:16px}
.bk-gizlilik.deneme i{color:var(--tur)}
@media (prefers-reduced-motion:reduce){ .bd-durum .ti-loader-2,.bk-hazirlaniyor>i{animation:none} }

/* Vatandaş Buluşması ve Mahalle Panosu (aşama 5) */
.vb-konular{display:grid;gap:6px;max-height:220px;margin:0 0 14px;padding:0;overflow:auto;border:0}
.vb-konular legend{margin-bottom:6px;color:var(--ink2);font-size:13.5px;font-weight:700}
.vb-konular legend small,.pc-lbl small{color:var(--mut);font-weight:400}
.vb-konular label{display:flex;align-items:center;gap:10px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;cursor:pointer}
.vb-konular label:has(input:checked){border-color:var(--btn);background:var(--soft-acc)}
.vb-konular input{accent-color:var(--btn);width:18px;height:18px;flex:none}
.vb-konular span{display:flex;align-items:center;gap:6px;flex:1;min-width:0;font-size:14px}
.vb-konular span i{color:var(--mut)}
.vb-konular em{color:var(--mut);font-size:12.5px;font-style:normal}
.vb-harita{height:220px;margin-top:4px;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.vb-satir{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.pc-lbl select,.pc-lbl input[type=date],.pc-lbl input[type=time]{height:44px;padding:0 10px;border:1px solid var(--line2);border-radius:12px;background:var(--kart);color:var(--ink)}
.vb-eylem{display:grid;gap:8px}
.vb-durum{display:flex;align-items:center;gap:6px;margin:0;color:#6B5F43;font-size:14px;font-weight:700}
.vb-durum.ok{color:var(--yes)}
.vb-not{display:flex;gap:6px;margin:0 0 12px;color:#4A3F22;font-size:14px}
.vb-liste{display:grid;gap:18px;grid-column:1}
.bulusma-kart.genis{padding:22px}
.bk-konu.genis{flex-wrap:wrap}
.bk-konu.genis a{width:120px;height:auto;flex-direction:column;align-items:stretch;padding:0 0 6px;background:#fff}
.bk-konu.genis a img,.bk-konu.genis a .ik-kare{width:120px;height:80px;display:grid;place-items:center;object-fit:cover}
.bk-konu.genis small{padding:4px 6px 0;color:#2B2410;font-size:12px;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bk-alt a{display:inline-flex;align-items:center;gap:6px;color:inherit;text-decoration:none}
.bant-eylem{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:14px}
.bant-eylem .geri{margin-top:0}
.bant-eylem .btn.ana{background:#fff;color:#1E3A5F}
.pano-alt{margin:8px 0 0;color:rgba(255,255,255,.85)}
.vb-kurallar{display:grid;gap:10px;margin:8px 0 0;padding:0;list-style:none;font-size:14px}
.vb-kurallar li{display:flex;gap:10px}
.vb-kurallar i{flex:none;margin-top:2px;color:var(--acc);font-size:18px}
.dk-eylem{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.dk-eylem .dk-yazi{margin:0}
.pano-liste{display:grid;gap:18px;grid-column:1}
.pano-kart{padding:22px;border-radius:var(--r);background:var(--kart);box-shadow:var(--golge)}
.pano-kart h2{font-size:19px;font-weight:800}
.pano-kart header p{display:flex;align-items:center;gap:6px;margin:4px 0 0;color:var(--mut);font-size:14px}
.pano-kart h3{margin:16px 0 8px;font-size:15px}
.pano-konular{display:grid;gap:8px;margin:0;padding:0;list-style:none}
.pano-konular li{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border:1px solid var(--line);border-radius:12px}
.pano-konular a{color:var(--ink);font-weight:700;text-decoration:none}
.pano-notlar{margin:0;padding:0;list-style:none}
.pano-notlar li{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.pano-notlar li:last-child{border-bottom:0}
.pano-eylem{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.pano-eylem:empty{display:none}
.pano-temsilci{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.etiket{display:inline-flex;align-items:center;gap:4px;padding:2px 9px;border-radius:999px;background:var(--soft);color:var(--ink2);font-size:12px;font-weight:700}
.etiket.temsilci{background:var(--tur-a);color:var(--tur)}
.pano-sayilar{display:grid;gap:8px;margin:10px 0 14px;padding:0;list-style:none}
.pano-sayilar li{display:flex;align-items:baseline;gap:8px}
.pano-sayilar b{font:800 24px var(--hf);color:var(--acc)}
.yan-kart h3{margin:10px 0 6px;font-size:14.5px}
@media (max-width:860px){
  .vb-liste,.pano-liste{order:1;align-self:stretch}
  .baslik-duzen>.yan>*{align-self:stretch}
  .bk-konu.genis a,.bk-konu.genis a img,.bk-konu.genis a .ik-kare{width:100px}
}
/* Fotoğrafta yüz ve plaka kapatma önizlemesi (js/gizlilik.js): dokunulan yer kapatılır */
.gz{margin-bottom:12px}
.gz-foto{display:block;max-width:100%;max-height:52vh;margin:0 auto;border-radius:14px;cursor:crosshair;touch-action:manipulation}
.gz-bilgi{margin:8px 0 0;color:var(--ink2);font-size:13.5px}
.gz-geri{margin-top:4px;font-size:13.5px}
.gorev.muhtar{background:var(--soft-acc);color:var(--acc)}
.yk-rol .rozet{margin-left:6px;vertical-align:middle;text-transform:none;letter-spacing:0}
/* "Bu Dert Kimin?" (4 Kasım) */
.rozet.seviye{background:var(--soft-acc);color:var(--acc)}
/* Soru açılınca satır uzuyor; oy kutusu satırın ortasına kayıp düğmelerin üstüne biniyordu (6 Kasım, telefonda) */
.yl li:has(> .kimin-soru) .yl-oy{top:12px;transform:none}
.yl li:has(> .kimin-soru) .yl-sat{min-height:96px}
.kimin-soru{position:relative;display:flex;flex-direction:column;gap:6px;margin:-4px 0 12px 42px;padding:8px 10px;border-radius:10px;background:var(--soft)}
.kimin-soru .ks-ust{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;padding-right:24px}
.kimin-soru b{font-size:13px}
.kimin-soru small{flex:1 1 150px;font-size:12.5px;color:var(--mut)}
.kimin-soru .ks-sec{display:flex;flex-wrap:wrap;gap:6px}
.kimin-soru button{padding:5px 11px;border:1px solid var(--line2);border-radius:999px;background:var(--kart);color:var(--ink);font:700 13px var(--ff);cursor:pointer}
.kimin-soru button:hover{border-color:var(--acc);color:var(--acc)}
.kimin-soru .kimin-gec{position:absolute;top:4px;right:4px;padding:4px 6px;border:0;background:none;color:var(--mut)}
.bk-kimin{display:flex;flex-direction:column;align-items:flex-start;gap:6px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.bk-kimin-bas{margin:0;font-weight:800;font-size:14px;color:var(--ink)}
.bk-kimin-bas small{font-weight:500;color:var(--mut)}
.bk-kimin-sec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;width:100%}
.bk-kimin-sec button{padding:8px 4px;border:1px solid var(--line2);border-radius:10px;background:var(--kart);color:var(--ink);font:700 13px var(--ff);cursor:pointer}
.bk-kimin-sec button[aria-pressed=true]{border-color:var(--acc);background:var(--acc);color:#fff}
.bk-kimin-say{display:flex;flex-wrap:wrap;gap:2px 10px;margin:0;font-size:13px;color:var(--ink2)}
.bk-kimin-say span{display:inline-flex;align-items:center;gap:4px}
.bk-kimin-say i{width:9px;height:9px;border-radius:50%}
.bk-kimin-not{margin:0;font-size:12.5px;line-height:1.45;color:var(--mut)}
/* Bu Dert Kimin? görseli: başlığın durduğu basamak, cevapların çubuğu; ortadaki çizgi yarısı */
.kimin-yol{display:flex;align-items:center;gap:16px;margin:0 0 2px;padding:0;list-style:none;font:700 12.5px var(--ff);color:var(--mut)}
.kimin-yol li{position:relative;display:inline-flex;align-items:center;gap:4px;padding:3px 9px;border-radius:999px;background:var(--soft)}
.kimin-yol li+li::before{content:"›";position:absolute;left:-12px;color:var(--mut);font-weight:800}
.kimin-yol li.gecti{background:var(--soft-acc);color:var(--acc)}
.kimin-yol li.su{background:var(--btn);color:#fff}
.kimin-cubuk{position:relative;display:flex;width:100%;height:10px;margin-top:2px;border-radius:999px;background:var(--soft)}
.kimin-cubuk span:first-child{border-radius:999px 0 0 999px}
.kimin-cubuk span:last-child{border-radius:0 999px 999px 0}
.kimin-cubuk::after{content:"";position:absolute;left:50%;top:-3px;bottom:-3px;width:2px;background:var(--ink)}
.kimin-cubuk .m,.bk-kimin-say .m{background:#C9D1DB}
.kimin-cubuk .c,.bk-kimin-say .c{background:#7C9CC6}
.kimin-cubuk .i,.bk-kimin-say .i{background:var(--yesil)}
.yl-ayrac{padding:12px 16px 4px;font:800 12.5px var(--ff);color:var(--mut)}
.pc-benzer:empty{display:none}
.pc-benzer{margin:-4px 0 12px;padding:10px 12px;border-radius:10px;background:var(--soft);font-size:13px}
.pc-benzer p{margin:0 0 6px;font-weight:800}
.pc-benzer p small{font-weight:500;color:var(--mut)}
.pc-benzer ul{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.pc-benzer a{display:block;font-weight:700;color:var(--acc);text-decoration:none}
.pc-benzer a small{display:block;font-weight:500;color:var(--mut)}
.gundem-nasil ol{margin:10px 0 0;padding-left:20px;display:grid;gap:8px;font-size:14px;line-height:1.45;color:var(--ink2)}

/* Gelişme kaydını bildirme bayrağı */
.gelismeler li{position:relative;padding-right:30px}
.gl-bildir{position:absolute;top:6px;right:0;padding:4px;border:0;background:none;color:var(--mut);font-size:15px;cursor:pointer}
.gl-bildir:hover{color:var(--ink)}