/* BALKAN LAZER — DASHBOARD TASARIM SİSTEMİ (TSK-130, KİLİTLİ spec birebir)
   Tek tasarım dili, tüm sayfalar bu dosyayı import eder. Kopyala-yapıştır YASAK.
   Birincil mavi #185FA5. TEK TEMA: LIGHT (TSK-160 — koyu mod kaldırıldı, tarayıcı koyu olsa da açık). */
:root{
  /* Cowork mockup paleti BİREBİR (docs/mockups/, README "RENK PALETİ birebir") */
  --primary:#185FA5; --primary-d:#0F4276; --primary-l:#E8F1FA; --accent:#F2B705;  /* mavi/koyu/açık + tescilli sarı */
  --bg:#F4F7FB; --panel:#ffffff; --card:#ffffff;
  --ink:#1B2733; --secondary:#6B7785; --hint:#8a97a8;
  --border:#E2E8F0; --border-s:#eef1f6;
  --red:#C0392B; --red-bg:#FCEBEA; --green:#1B8A5A; --green-bg:#EAF6F0; --amber:#C8881A; --amber-bg:#FBF2E0;
  --radius:14px; --radius-s:10px; --shadow:0 1px 3px rgba(16,40,80,.05);
}
/* TSK-160 — koyu @media KALDIRILDI: dashboard tarayıcı koyu modunda bile AÇIK (light) kalır. */
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
:root{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  font-size:15px;line-height:1.45;padding-bottom:40px}
.wrap{max-width:1080px;margin:0 auto;padding:0 14px}

/* ── ÜST BAR ── (mockup: mavi-koyu #0F4276) */
.topbar{background:var(--primary-d);color:#fff;position:sticky;top:0;z-index:20}
.topbar .in{max-width:1080px;margin:0 auto;padding:11px 14px;display:flex;align-items:center;gap:12px}
.topbar .logo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:17px;letter-spacing:.3px}
.topbar .logo .mark{width:26px;height:26px;border-radius:7px;background:var(--accent);color:var(--primary-d);
  display:grid;place-items:center;font-size:15px;font-weight:900}
.topbar .sub{font-size:12px;opacity:.85;font-weight:500}
.topbar .clock{margin-left:auto;font-size:12.5px;opacity:.9;text-align:right;line-height:1.3}
.topbar .cikis{background:rgba(255,255,255,.14);border:none;color:#fff;border-radius:9px;padding:7px 11px;font-size:12.5px;font-weight:600;margin-left:10px}

/* ── DEPARTMAN NAV (yatay sekme) ── */
.deptnav{background:var(--panel);border-bottom:1px solid var(--border);position:sticky;top:48px;z-index:15;overflow-x:auto}
.deptnav .in{max-width:1080px;margin:0 auto;display:flex;gap:2px;padding:0 8px}
.deptnav button{flex:0 0 auto;background:none;border:none;border-bottom:2.5px solid transparent;color:var(--secondary);
  padding:13px 15px;font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer}
.deptnav button.on{color:var(--primary);border-bottom-color:var(--primary)}

/* ── ACİL ŞERİT ── */
.acilbar{background:var(--red-bg);border:1px solid var(--red);border-radius:var(--radius);margin:14px 0;padding:13px 15px}
.acilbar h3{margin:0 0 7px;font-size:14px;color:var(--red);display:flex;align-items:center;gap:7px}
.acilbar .it{display:flex;justify-content:space-between;gap:12px;padding:6px 0;border-top:1px solid color-mix(in srgb,var(--red) 25%,transparent);font-size:14px}
.acilbar .it:first-of-type{border-top:none}
.acilbar .it b{color:var(--ink)}

/* ── KART GRID + KART (mockup standardı, KİLİTLİ) ── */
.section-h{font-size:13px;font-weight:700;color:var(--secondary);text-transform:uppercase;letter-spacing:.5px;margin:18px 2px 10px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px}
.card{background:var(--card);border:.5px solid var(--border);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);
  cursor:default;transition:border-color .12s}
.card.tappable{cursor:pointer}
.card.tappable:active{border-color:var(--primary)}
.card .lbl{font-size:12px;color:var(--secondary);font-weight:600;line-height:1.3;min-height:31px}
.card .val{font-size:23px;font-weight:500;letter-spacing:-.4px;margin:6px 0 3px;line-height:1.1}
.card .val.red{color:var(--red)} .card .val.green{color:var(--green)} .card .val.amber{color:var(--amber)}
.card .hint{font-size:11px;color:var(--hint);line-height:1.4}
.card .more{font-size:11px;color:var(--primary);font-weight:600;margin-top:8px;display:flex;align-items:center;gap:4px}
.card .more::after{content:"▾";font-size:9px;transition:transform .15s}
.card.open .more::after{transform:rotate(180deg)}
/* accordion detay */
.card .detay{display:none;margin-top:12px;padding-top:11px;border-top:1px solid var(--border-s)}
.card.open .detay{display:block}
.card .detay table{width:100%;border-collapse:collapse;font-size:13px}
.card .detay td,.card .detay th{text-align:right;padding:6px 4px;border-bottom:1px solid var(--border-s)}
.card .detay td:first-child,.card .detay th:first-child{text-align:left;color:var(--secondary)}
.card .detay th{font-size:11px;text-transform:uppercase;color:var(--hint);font-weight:600}

/* pill / durum */
.pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:600}
.pill.ok{background:var(--green-bg);color:var(--green)} .pill.warn{background:var(--amber-bg);color:var(--amber)}
.pill.bad{background:var(--red-bg);color:var(--red)} .pill.info{background:#e7eef7;color:var(--primary)}

/* tablo (üretim ay-kıyas vs) */
.tbl{width:100%;border-collapse:collapse;font-size:14px;background:var(--card);border:.5px solid var(--border);border-radius:var(--radius);overflow:hidden}
.tbl th,.tbl td{text-align:right;padding:10px 11px;border-bottom:1px solid var(--border-s)}
.tbl th:first-child,.tbl td:first-child{text-align:left}
.tbl th{font-size:11.5px;text-transform:uppercase;color:var(--hint);font-weight:600;background:var(--panel)}
.tbl tr:last-child td{border-bottom:none}
.up{color:var(--green);font-weight:600} .down{color:var(--red);font-weight:600} .flat{color:var(--hint)}

/* TSK-131 — yıllık üretim trendi bar grafik */
.bars{display:flex;align-items:flex-end;gap:4px;height:120px;padding-top:6px}
.bcol{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;justify-content:flex-end}
.bar{width:100%;max-width:34px;background:var(--border);border-radius:4px 4px 0 0;min-height:4px;transition:height .35s}
.bar.cur{background:var(--primary)}
.bl{font-size:9.5px;color:var(--hint);margin-top:4px;white-space:nowrap}
/* TSK-166 — yığılmış 3-seri (kulak/tashih/disk) + sipariş işareti */
/* TSK-192 FIX: .barstack'a height:100% (segment %'leri çözülsün) + .seg reset (`.seg` segmented-seçici
   sınıfından sızan padding/margin/display:flex yığın çubuklarını bozuyordu — render olmuyordu). */
.barstack{width:100%;max-width:34px;height:100%;display:flex;flex-direction:column;justify-content:flex-end;min-height:4px}
.barstack .seg{width:100%;transition:height .35s;padding:0;margin:0;display:block;flex:none;background:none;border-radius:0}
.barstack .seg.kulak{background:var(--primary)}
.barstack .seg.tashih{background:#E0A030}
.barstack .seg.disk{background:#5FB37A;border-radius:4px 4px 0 0}
.barstack .seg.kulak:first-child{border-radius:4px 4px 0 0}
.uretim-leg{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--ink);margin:2px 2px 10px}
.uretim-leg i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.sip-dot{font-size:9px;color:#185FA5;margin-top:2px;font-weight:700}
/* TSK-167 — saç serbest ebat girişi (en×boy + kalınlık etiketi) */
.sac-ebat{display:flex;align-items:center;gap:6px;margin:2px 0 6px}
.sac-ebat input{width:74px;text-align:center;padding:11px 8px;border:1px solid var(--line);border-radius:10px;font-size:16px;background:#fff}
.sac-ebat .x{color:var(--dim);font-weight:700}
.sac-ebat .kal-et{padding:11px 12px;background:var(--primary-l);border-radius:10px;font-weight:700;color:var(--primary);font-size:15px}
/* TSK-164 — üst bant tek satır özet */
.todobar-mini{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;
  background:#fff;border:1px solid var(--line);border-left:4px solid var(--accent,#185FA5);border-radius:12px;
  padding:12px 15px;margin:0 0 4px;cursor:pointer;font-size:14px;text-align:left}
.todobar-mini.kritik{border-left-color:#C0392B;background:#FDF3F2}
.todobar-mini.ok{border-left-color:#5FB37A;background:#F3FAF5}
.todobar-mini .tm-say{font-weight:700;color:var(--ink,#1B2733)}
.todobar-mini .tm-link{color:var(--primary,#185FA5);font-weight:700;white-space:nowrap}
/* TSK-165 — departman AI paneli */
.ai-blok{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 13px;margin:8px 0}
.ai-blok-h{font-weight:800;font-size:14px;color:var(--ink,#1B2733);margin-bottom:8px}
.bulgu-kart,.hazir-kart,.gorev-kart{border:1px solid var(--line);border-radius:10px;padding:10px 11px;margin:7px 0;background:#FBFCFE}
.bulgu-kart.onayli{opacity:.62}
.bk-bas,.hk-bas,.gk-bas{font-size:14px;line-height:1.35;color:var(--ink,#1B2733)}
.bk-detay,.gk-alt,.hk-alt{font-size:12.5px;color:var(--dim,#6B7785);margin-top:3px;line-height:1.45}
.bk-oneri{font-size:12.5px;color:var(--primary,#185FA5);margin-top:4px;font-weight:600}
.bk-yorum{font-size:12.5px;color:#7A5C00;background:#FFF8E6;border-radius:6px;padding:4px 7px;margin-top:5px}
.gk-dept{display:inline-block;font-size:11px;background:var(--primary-l,#EAF2FB);color:var(--primary,#185FA5);border-radius:5px;padding:1px 7px;margin-left:4px;font-weight:700;vertical-align:1px}
.g-aks{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.mini-btn{border:1px solid var(--line);background:#fff;color:var(--ink,#1B2733);border-radius:8px;padding:7px 12px;font-size:13px;font-weight:600;cursor:pointer}
.mini-btn.ok{border-color:#5FB37A;color:#2E7D4F}
.mini-btn.bad{border-color:#E0A0A0;color:#C0392B}
.mini-btn:active{transform:scale(.96)}
/* TSK-164 — departman filtre çipleri */
.dept-cips{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 12px}
.cip{border:1px solid var(--line);background:#fff;color:var(--ink,#1B2733);border-radius:20px;padding:7px 13px;font-size:13px;font-weight:600;cursor:pointer}
.cip.on{background:var(--primary,#185FA5);color:#fff;border-color:var(--primary,#185FA5)}
/* TSK-169 — ağ haritası */
.ag-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:2px 2px 10px}
.ag-st{font-size:13px;color:var(--ink,#1B2733)}
.ag-cak{font-size:11.5px;color:#C0392B;margin-top:2px;font-weight:600}
/* TSK-131 — Sevk&Stok sayım aracı (dokunmatik) */
.op-btn{background:var(--primary);color:#fff;border:none;border-radius:11px;padding:11px 16px;font-size:14px;font-weight:700;white-space:nowrap}
.urun-liste{margin-top:14px;border-top:1px solid var(--border-s);padding-top:6px;max-height:62vh;overflow-y:auto}
.urow{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 2px;border-bottom:1px solid var(--border-s)}
.urow.done{opacity:.65}
.uad{min-width:0;flex:1}.uad b{display:block;font-size:14px;line-height:1.2}.uad span{font-size:11px;color:var(--hint)}
.ucnt{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.ubtn{width:44px;height:44px;border:none;border-radius:12px;font-size:25px;font-weight:800;line-height:1;cursor:pointer}
.ubtn.minus{background:var(--red-bg);color:var(--red)} .ubtn.plus{background:var(--green-bg);color:var(--green)}
.uval{min-width:40px;text-align:center;font-size:19px;font-weight:700}
.uind{width:15px;font-size:14px;color:var(--green)}
.loading,.empty{text-align:center;color:var(--secondary);padding:40px 16px;font-size:14px}
.note{font-size:12px;color:var(--hint);text-align:center;margin:16px 0;line-height:1.5}
.hidden{display:none!important}

/* ── TSK-145 PROAKTİF YAPILACAKLAR (üst şerit) — mockup .yapilacaklar birebir ── */
.todowrap{margin:16px 0 4px}
.todobar{background:#fff;border:1px solid var(--border);border-left:5px solid var(--amber);
  border-radius:12px;padding:16px 18px;box-shadow:var(--shadow)}
.todobar.ok{border-left-color:var(--green)}
.todobar-h{font-size:14px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;
  color:var(--primary-d);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.todo-bos{font-size:13px;color:var(--green);font-weight:600}
.todo-item{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:none;border:none;
  border-bottom:1px dashed var(--border);padding:9px 0;cursor:pointer;color:var(--ink);font:inherit}
.todo-item:last-child{border-bottom:none}
.todo-item:active{opacity:.6}
.todo-item .ti-dot{font-size:15px;width:22px;text-align:center;flex:0 0 auto}
.todo-item .ti-main{flex:1;min-width:0}
.todo-item .ti-main b{display:block;font-size:14px;font-weight:700;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.todo-item .ti-sub{display:block;font-size:12px;color:var(--secondary);line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.todo-item .ti-deger{flex:0 0 auto;font-size:14px;font-weight:800;white-space:nowrap;color:var(--ink)}
.todo-item .ti-chev{flex:0 0 auto;color:var(--primary);font-size:18px;font-weight:700}

/* ── TSK-145 SAYIM GİRİŞİ — gercek_sayim_giris_tasarim mockup BİREBİR ── */
.sayim-alt{color:var(--secondary);font-size:13px;margin:-4px 2px 14px}
.sayim-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:18px}
.sayim-grid .card{padding:20px}
.sc-h{font-size:15px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px}
.etiket{font-size:12px;color:var(--secondary);font-weight:600;text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px;display:block}
.urun-sec{width:100%;padding:11px 12px;border:1px solid var(--border);border-radius:9px;font-size:14px;background:var(--card);color:var(--ink);margin-bottom:16px}
/* segmented birim seçici (mockup .seg) */
.seg{display:flex;background:var(--primary-l);border-radius:10px;padding:4px;gap:4px;margin-bottom:16px}
.seg button{flex:1;padding:10px;border:none;background:transparent;border-radius:7px;font-size:14px;font-weight:600;color:var(--primary);cursor:pointer}
.seg button.aktif{background:var(--primary);color:#fff;box-shadow:0 1px 4px rgba(24,95,165,.4)}
.seg3 button{padding:10px 6px;font-size:13px}   /* TSK-161 — 3 mod (Kulak/Saç/Disk+Tashih) */
/* miktar +/- (editable input) */
.miktar{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.miktar input{flex:1;text-align:center;font-size:22px;font-weight:700;padding:10px;border:1px solid var(--border);border-radius:9px;background:var(--card);color:var(--ink);min-width:0}
.miktar button{width:48px;height:48px;border:1px solid var(--border);background:var(--card);border-radius:9px;font-size:22px;font-weight:700;color:var(--primary);cursor:pointer;flex:0 0 auto}
.miktar.mini{margin-bottom:4px}.miktar.mini input{font-size:17px;padding:9px}
.birim-not{font-size:12px;color:var(--secondary);margin-bottom:16px}
.sc-uyari{background:var(--amber-bg);color:var(--amber);font-size:12.5px;border-radius:10px;padding:9px 12px;margin-bottom:14px}
/* "ne kaydedilecek" önizleme (mockup .onizle) */
.onizle{background:var(--primary-l);border:1px dashed var(--primary);border-radius:10px;padding:14px;margin-bottom:16px}
.onizle .satir{font-size:13px;color:var(--primary-d);margin-bottom:4px}
.onizle .sonuc{font-size:18px;font-weight:800;color:var(--primary);margin-top:6px}
.oz-uyari{font-size:13px;color:var(--amber);font-weight:600}
.kaydet{width:100%;padding:13px;background:var(--primary);color:#fff;border:none;border-radius:10px;font-size:15px;font-weight:700;cursor:pointer}
.kaydet:disabled{opacity:.6}
/* bugün girilenler + düzelt (mockup .liste-satir) */
.liste-satir{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid var(--border)}
.liste-satir:last-child{border-bottom:none}
.ls-sol{min-width:0;flex:1}.ls-sol b{font-size:14px}.ls-sol span{display:block;font-size:12px;color:var(--secondary)}
.ls-sag{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.ls-deger{font-weight:700;color:var(--ink)}
.duzelt{color:var(--primary);font-size:13px;font-weight:600;text-decoration:none;cursor:pointer}
.rozet{font-size:11px;font-weight:700;padding:2px 8px;border-radius:20px;background:var(--green-bg);color:var(--green)}
.gunluk-bos{font-size:13px;color:var(--hint);padding:8px 0}
@media(max-width:680px){.sayim-grid{grid-template-columns:1fr}}
/* ── TSK — Sipariş tamamlanma: dönem seçici + kategori blok + totaller + satır aksiyon ── */
.donem-sec{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.donem-sec button{background:var(--card);border:1px solid var(--border);color:var(--secondary);border-radius:9px;padding:8px 14px;font-size:13px;font-weight:700;cursor:pointer}
.donem-sec button.aktif{background:var(--primary);border-color:var(--primary);color:#fff}
.kat-baslik{font-size:14px;font-weight:700;color:var(--primary-d);margin:16px 2px 7px;display:flex;align-items:baseline;gap:8px}
.kat-baslik span{font-size:12px;font-weight:500;color:var(--hint)}
.tbl-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sip-tbl th,.sip-tbl td{white-space:nowrap}
.sip-tbl tr.grup-top td{font-weight:700;background:var(--bg);border-top:1.5px solid var(--border)}
.genel-top{margin-top:10px;background:var(--primary-l)}
.genel-top td{font-size:14px;border-bottom:none}
.satir-iptal td{opacity:.5;text-decoration:line-through}
.satir-iptal .sip-akt{text-decoration:none}
.sip-akt{display:flex;gap:5px;white-space:nowrap}
.sa-btn{border:1px solid var(--border);background:var(--card);border-radius:7px;padding:5px 9px;font-size:12px;font-weight:700;cursor:pointer;color:var(--secondary)}
.sa-btn.iptal{color:var(--red)} .sa-btn.kapat{color:var(--green)} .sa-btn.duzelt{color:var(--primary)} .sa-btn.geri{color:var(--primary)}
.sa-btn:active{transform:scale(.96)}
.fiyat-bekliyor{font-size:11px;color:var(--amber);font-weight:600;font-style:italic}

/* görev işlem butonları */
.gorev-akt{display:flex;gap:8px;margin-top:11px}
.gorev-akt button{flex:1;background:var(--bg);border:1px solid var(--border);color:var(--secondary);border-radius:10px;padding:10px 6px;font-size:13px;font-weight:700;cursor:pointer}
.gorev-akt button.ok{background:var(--green-bg);border-color:color-mix(in srgb,var(--green) 35%,transparent);color:var(--green)}
.gorev-akt button:active{border-color:var(--primary)}
.hint.red{color:var(--red)} .hint.amber{color:var(--amber)}

/* toast */
.bd-toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--primary);color:#fff;
  padding:13px 22px;border-radius:13px;font-size:14px;font-weight:600;opacity:0;pointer-events:none;transition:opacity .25s;z-index:60;max-width:90%;text-align:center;box-shadow:0 6px 24px rgba(0,0,0,.25)}
.bd-toast.show{opacity:1} .bd-toast.err{background:var(--red)}

@media(max-width:560px){
  .topbar .sub{display:none} .card .val{font-size:21px}
  .deptnav button{padding:12px 12px;font-size:13px}
  .sc-val{font-size:44px} .todo-item .ti-sub{display:none}
}

/* ═══════════════════════════════════════════════════════════════════
   v3 KOMUTA KATMANI — 10.09.2026 (docs/web_panel_v3_teshis_plan.md)
   KİLİTLİ palet KORUNUR; bu katman yalnız EKLER (km-* önekli) — tek tema, koyu mod yok.
   İki katman tek sayfa: OPERASYON (herkese açık) · YÖNETİM (girişli). Kişi adı yok.
   ═══════════════════════════════════════════════════════════════════ */
[hidden]{display:none!important}
.km-wrap{max-width:1440px;margin:0 auto;padding:0 14px 40px}
.km-topbar .in{max-width:1440px}
.km-tpill{display:inline-flex;align-items:center;gap:6px;background:rgba(255,255,255,.14);border-radius:9px;padding:6px 10px;font-size:12.5px;font-weight:600;color:#fff;white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.km-tpill.ok{background:var(--green)} .km-tpill.warn{background:var(--amber)} .km-tpill.bad{background:var(--red)} .km-tpill.acc{background:var(--accent);color:var(--primary-d)}
.km-tpill button,.km-tpill a{background:none;border:none;color:inherit;font:inherit;cursor:pointer;padding:0}
.km-sag{margin-left:auto;display:flex;gap:8px;align-items:center;flex-wrap:wrap;justify-content:flex-end;min-width:0;max-width:100%}
.km-topbar .in{flex-wrap:wrap;row-gap:8px}
.km-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.km-katman{font-size:10px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:2px 7px;border-radius:6px;white-space:nowrap}
.km-katman.pub{background:var(--green-bg);color:var(--green)} .km-katman.yon{background:var(--primary-d);color:var(--accent)}
.km-h{font-size:13px;font-weight:700;color:var(--secondary);text-transform:uppercase;letter-spacing:.5px;margin:18px 2px 10px;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.km-h .kaynak{font-weight:500;text-transform:none;letter-spacing:0;font-size:11px;color:var(--hint)}
.km-h .detay-btn{margin-left:auto;font-size:11px;color:var(--primary);font-weight:600;background:none;border:none;cursor:pointer;font-family:inherit}
.km-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:12px}
.km-2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
.km-ana{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;align-items:start}
@media(max-width:1000px){.km-ana{grid-template-columns:1fr}.km-2{grid-template-columns:1fr}}
.km-kart{background:var(--card);border:.5px solid var(--border);border-radius:var(--radius);padding:14px;box-shadow:var(--shadow);display:flex;flex-direction:column;gap:2px;min-width:0}
.km-kart .lbl{font-size:12px;color:var(--secondary);font-weight:600;line-height:1.3;min-height:0}
.km-kart .val{font-size:23px;font-weight:500;letter-spacing:-.4px;margin:6px 0 3px;line-height:1.1;overflow-wrap:anywhere}
.km-kart .val.red{color:var(--red)} .km-kart .val.green{color:var(--green)} .km-kart .val.amber{color:var(--amber)}
.km-kart .hint{font-size:11px;color:var(--hint);line-height:1.4}
.km-kart.sik{padding:10px 12px}
.km-chip{display:inline-block;font-size:10.5px;padding:1px 7px;border-radius:9px;background:#eef1f6;color:var(--secondary);font-weight:600;vertical-align:middle;white-space:nowrap}
.km-chip.kesin{background:var(--green-bg);color:var(--green)} .km-chip.yuksek{background:var(--primary-l);color:var(--primary)}
.km-chip.orta{background:#eef1f6;color:var(--secondary)} .km-chip.teyitsiz{background:var(--amber-bg);color:var(--amber)} .km-chip.bilinmiyor{background:var(--red-bg);color:var(--red)}
.km-chip.uzun{white-space:normal;overflow-wrap:anywhere;display:inline;line-height:1.5}
.km-tbl td{overflow-wrap:anywhere}
.km-pill{display:inline-block;padding:2px 9px;border-radius:20px;font-size:11.5px;font-weight:600;line-height:1.4;white-space:nowrap}
.km-pill.ok{background:var(--green-bg);color:var(--green)} .km-pill.bad{background:var(--red-bg);color:var(--red)} .km-pill.amber{background:var(--amber-bg);color:var(--amber)} .km-pill.gri{background:#eef1f6;color:var(--secondary)} .km-pill.mavi{background:var(--primary-l);color:var(--primary)}
.km-tbl{width:100%;border-collapse:collapse;font-size:13px}
.km-tbl th{text-align:left;font-size:11px;color:var(--secondary);font-weight:700;text-transform:uppercase;letter-spacing:.4px;padding:4px 6px;border-bottom:1px solid var(--border)}
.km-tbl td{padding:6px 6px;border-bottom:1px solid var(--border-s);vertical-align:top}
.km-tbl tr:last-child td{border-bottom:none}
.km-tbl .grup td{background:#eef1f6;font-size:11px;font-weight:700;color:var(--primary-d);text-transform:uppercase;padding:5px 8px}
.km-tbl .sonuk td{opacity:.55}
.km-tbl th.sag{text-align:right}
.sag{text-align:right} .mono{font-variant-numeric:tabular-nums}
.km-strip{background:var(--amber-bg);border:1px solid var(--amber);border-radius:var(--radius);padding:13px 15px;margin-top:14px;display:flex;flex-direction:column;gap:10px}
.km-strip .baslik{font-size:14px;color:var(--amber);font-weight:700;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.km-strip .baslik .hint{font-weight:500;color:var(--hint);font-size:11px}
.km-tiles{display:flex;gap:10px;flex-wrap:wrap}
.km-tile{flex:1 1 180px;background:var(--card);border:.5px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;gap:10px;align-items:center;min-width:0;cursor:pointer;text-decoration:none;color:inherit}
.km-tile .ik{width:34px;height:34px;border-radius:9px;background:var(--amber-bg);display:grid;place-items:center;flex:0 0 auto}
.km-tile .n{font-size:22px;font-weight:600;letter-spacing:-.4px;line-height:1}
.km-tile .n.red{color:var(--red)} .km-tile .n.green{color:var(--green)} .km-tile .n.amber{color:var(--amber)}
.km-tile .lbl{font-size:12px;color:var(--secondary);font-weight:600;margin-top:3px}
.km-tile .hint{font-size:11px;color:var(--hint);line-height:1.35}
.km-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:10px;padding:9px 14px;font-size:13px;font-weight:700;border:1px solid var(--border);background:var(--card);color:var(--ink);cursor:pointer;min-height:36px;font-family:inherit}
.km-btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.km-btn.ok{background:var(--green);color:#fff;border-color:var(--green)}
.km-btn.bad{background:var(--card);color:var(--red);border-color:var(--red)}
.km-btn:disabled{opacity:.5;cursor:default}
.km-btn.kucuk{padding:6px 10px;min-height:30px;font-size:12px}
.km-bar{background:#eef1f6;border-radius:6px;height:10px;overflow:hidden;position:relative}
.km-bar>div{height:100%;border-radius:6px;background:var(--primary)}
.km-bar.buyuk{height:22px;border-radius:8px}
.km-bar .etiket{position:absolute;top:2px;left:10px;font-size:12px;font-weight:600;color:#fff}
.km-bar .etiket.koyu{color:var(--primary-d)}
.km-dot{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle}
.km-dot.iyi{background:var(--green)} .km-dot.kotu{background:var(--red)} .km-dot.sari{background:var(--accent)}
.km-aiband{background:var(--primary-l);border:1px dashed var(--primary);border-radius:10px;padding:8px 12px;font-size:12px;color:var(--primary-d)}
.km-hata{background:var(--red-bg);border:1px solid #f5c6cb;color:#a3261c;border-radius:8px;padding:8px 12px;font-size:12px;margin-top:10px}
.km-uyari{background:var(--amber-bg);border:1px solid #ffe082;color:#8a5b00;border-radius:8px;padding:8px 12px;font-size:12px}
.km-bilgi{background:var(--primary-l);border:1px solid var(--primary);border-radius:var(--radius);padding:12px 15px;display:flex;align-items:center;gap:12px;font-size:13px;color:var(--primary-d);margin-top:14px;flex-wrap:wrap}
.km-islem{border:1px solid var(--border);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:8px}
.km-islem.kritik{border-left:4px solid var(--red)} .km-islem.yuksek{border-left:4px solid var(--amber)} .km-islem.orta{border-left:4px solid var(--secondary)}
.km-islem .ust{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.km-islem .metin{font-size:13px;line-height:1.35}
.km-islem .akt{display:flex;gap:6px;flex-wrap:wrap}
.km-islem textarea{width:100%;border:1px solid var(--border);border-radius:8px;padding:6px 8px;font:inherit;font-size:12.5px;min-height:34px;resize:vertical}
.km-katla{display:none} .km-acik .km-katla{display:block}
.km-alt{margin-top:18px;font-size:11px;color:var(--hint);display:flex;gap:14px;flex-wrap:wrap}
.km-spark{width:100%;height:90px;background:var(--bg);border-radius:8px;display:block}
.km-giris{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}
.km-giris .kutu{width:100%;max-width:460px;padding:34px 38px;display:flex;flex-direction:column;gap:16px}
.km-giris input{width:100%;border:1px solid var(--border);border-radius:10px;padding:12px 13px;font:inherit;font-size:15px;min-height:46px;background:var(--card);color:var(--ink)}
.km-giris .ayrac{display:flex;align-items:center;gap:10px}.km-giris .ayrac div{flex:1;height:1px;background:var(--border)}
.km-giris .not{font-size:11px;color:var(--hint);background:var(--bg);border-radius:8px;padding:10px 12px;line-height:1.55}
@media(max-width:560px){.km-tile{flex:1 1 140px}.km-kart .val{font-size:20px}.km-giris .kutu{padding:24px 20px}.km-tpill{font-size:11.5px;padding:5px 8px}.km-tbl{font-size:12px}.km-tbl td,.km-tbl th{padding:5px 4px}}

/* ── SAHA YÜZEYİ (v3.1 · 11.09.2026) — Komuta ile AYNI açık tema; yalnız dokunmatik ölçü (≥44px hedef) ──
   Koyu saha varyantı (data-yuzey özniteliği) KALDIRILDI (patron 10.09: "tema diğerleriyle aynı olsun"). sh-* = saha-terminali.html. */
.sh-body [id]{scroll-margin-top:76px}
.sh-ana{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}
@media(max-width:1000px){.sh-ana{grid-template-columns:1fr}}
.sh-form{gap:0;padding:16px}
.sh-adim{display:flex;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--secondary);margin-bottom:12px}
.sh-adim span{background:var(--bg);border-radius:8px;padding:4px 9px}
.sh-adim b{color:var(--primary-d)}
.sh-lbl{font-size:12px;font-weight:700;color:var(--secondary);text-transform:uppercase;letter-spacing:.5px;margin:14px 0 7px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sh-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.sh-seg.iki{grid-template-columns:repeat(2,minmax(0,1fr))}
.sh-seg button{min-height:56px;border:1.5px solid var(--border);background:var(--card);color:var(--ink);border-radius:12px;font:inherit;font-size:16px;font-weight:700;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;padding:6px}
.sh-seg button small{font-size:11px;font-weight:600;color:var(--secondary)}
.sh-seg button.on{background:var(--primary);border-color:var(--primary);color:#fff}
.sh-seg button.on small{color:#d6e6f7}
.sh-filtre{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.sh-filtre button{min-height:40px;border:1px solid var(--border);background:var(--card);color:var(--secondary);border-radius:20px;padding:6px 13px;font:inherit;font-size:13px;font-weight:600;cursor:pointer}
.sh-filtre button.on{background:var(--primary-l);border-color:var(--primary);color:var(--primary-d)}
.sh-urunler{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;max-height:360px;overflow-y:auto;padding:2px;-webkit-overflow-scrolling:touch}
.sh-urun{min-height:58px;border:1.5px solid var(--border);background:var(--card);border-radius:11px;padding:8px 10px;text-align:left;cursor:pointer;font:inherit;color:var(--ink);display:flex;flex-direction:column;gap:2px;min-width:0}
.sh-urun b{font-size:15px;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.sh-urun span{font-size:11px;color:var(--secondary);line-height:1.35;overflow-wrap:anywhere}
.sh-urun em{font-style:normal;color:var(--amber);font-weight:700}
.sh-urun i{font-style:normal;color:var(--green);font-weight:700}
.sh-urun.on{border-color:var(--primary);background:var(--primary-l);box-shadow:inset 0 0 0 1px var(--primary)}
.sh-urun.sayildi{border-left:4px solid var(--green)}
.sh-ara{width:100%;min-height:50px;border:1.5px solid var(--border);border-radius:11px;padding:0 14px;font:inherit;font-size:17px;background:var(--card);color:var(--ink);margin-bottom:8px}
.sh-ara:focus,.sh-miktar input:focus,.sh-ebat input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-l)}
.sh-kal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.sh-kal button{min-height:50px;border:1.5px solid var(--border);background:var(--card);border-radius:11px;font:inherit;font-size:18px;font-weight:700;color:var(--ink);cursor:pointer}
.sh-kal button small{font-size:11px;color:var(--secondary);font-weight:600}
.sh-kal button.on{background:var(--accent);border-color:var(--accent);color:var(--primary-d)}
.sh-kal button.on small{color:var(--primary-d)}
.sh-ebat{display:flex;align-items:center;gap:8px}
.sh-ebat input{flex:1;min-width:0;min-height:52px;text-align:center;border:1.5px solid var(--border);border-radius:11px;font:inherit;font-size:19px;font-weight:700;color:var(--ink);background:var(--card)}
.sh-ebat>span{font-size:18px;color:var(--secondary);font-weight:700}
.sh-ebat .km-chip{font-size:13px;padding:6px 10px}
.sh-miktar{display:grid;grid-template-columns:64px minmax(0,1fr) 64px;gap:10px;margin-top:4px}
.sh-miktar button{min-height:64px;border:1.5px solid var(--border);background:var(--card);border-radius:12px;font:inherit;font-size:30px;font-weight:700;color:var(--primary-d);cursor:pointer;line-height:1}
.sh-miktar input{min-height:64px;width:100%;min-width:0;text-align:center;border:2px solid var(--primary);border-radius:12px;font:inherit;font-size:30px;font-weight:700;color:var(--ink);background:var(--card);font-variant-numeric:tabular-nums}
.sh-onizle{background:var(--primary-l);border:1px solid color-mix(in srgb,var(--primary) 30%,transparent);border-radius:12px;padding:12px 14px;margin:12px 0;text-align:center;min-height:62px;display:flex;flex-direction:column;justify-content:center}
.sh-onizle .conv{font-size:13px;color:var(--secondary)}
.sh-onizle .res{font-size:26px;font-weight:700;color:var(--primary-d);font-variant-numeric:tabular-nums}
.sh-onizle.bad{background:var(--amber-bg);border-color:#ffe082}
.sh-onizle.bad .res{font-size:16px;color:#8a5b00}
.sh-kaydet{width:100%;min-height:64px;border:none;border-radius:14px;background:var(--green);color:#fff;font:inherit;font-size:20px;font-weight:800;letter-spacing:.4px;cursor:pointer;box-shadow:0 3px 0 #146b45}
.sh-kaydet:active{transform:translateY(2px);box-shadow:0 1px 0 #146b45}
.sh-kaydet:disabled{background:#c9d2dc;box-shadow:none;cursor:default}
.sh-body .km-tile{min-height:74px}
.sh-body .km-btn.kucuk{min-height:44px;padding:8px 14px;font-size:13px}
.sh-body .km-tbl td{vertical-align:middle}
@media(max-width:560px){.sh-urunler{grid-template-columns:repeat(2,minmax(0,1fr));max-height:none;overflow:visible}.sh-miktar{grid-template-columns:56px minmax(0,1fr) 56px}.sh-seg button{font-size:15px}.sh-form{padding:12px}}