:root{
  --marka-teal:#12343d; --marka-yesil:#31ae48; --marka-siyah:#231f20; --marka-beyaz:#fff;
  --teal-900:#0c2229; --teal-800:#12343d; --teal-700:#1a4551; --teal-600:#235768; --teal-500:#2e6b7e;
  --zemin:#fbfbfc; --yuzey-1:#fff; --yuzey-2:#f5f6f7; --yuzey-3:#eceef0; --yuzey-4:#e2e5e8;
  --cizgi:#e3e6e9; --cizgi-guclu:#cbd1d6; --cizgi-ucuncul:#b4bcc3;
  --metin:#231f20; --metin-ikincil:#4a5156; --metin-silik:#70787e; --metin-pasif:#9aa1a7; --metin-ters:#fff;
  --vurgu:#31ae48; --vurgu-hover:#268c39; --vurgu-zemin:#e8f6eb; --vurgu-metin:#1e7a31; --odak-halka:#31ae48;
  --basari:#1e7a31; --basari-zemin:#e8f6eb; --uyari:#b26a00; --uyari-zemin:#fdf3e3;
  --hata:#c0392b; --hata-zemin:#fbeae8; --bilgi:#12343d; --bilgi-zemin:#e7edef; --notr:#70787e; --notr-zemin:#f0f2f4;
  --menu-zemin:var(--teal-800); --menu-metin:rgba(255,255,255,.72); --menu-metin-aktif:#fff; --menu-hover:var(--teal-700); --menu-secili:var(--teal-600); --menu-serit:var(--marka-yesil); --menu-grup:rgba(255,255,255,.45); --menu-cizgi:var(--teal-500);
  --font-govde:"Inter",-apple-system,system-ui,"Segoe UI",Roboto,sans-serif; --font-baslik:"Space Grotesk",var(--font-govde); --font-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --b1:4px;--b2:8px;--b3:12px;--b4:16px;--b5:24px;--b6:32px; --r-xs:3px;--r-sm:5px;--r-md:7px;--r-lg:10px;--r-xl:14px;--r-pill:9999px;
  --golge:0 1px 2px rgba(18,52,61,.04),0 1px 3px rgba(18,52,61,.06); --golge-cagri:0 8px 28px rgba(18,52,61,.18);
  --gecis:120ms cubic-bezier(.2,0,.2,1); --ust-cubuk:56px; --menu-genislik:250px;
  /* geriye dönük uyum — eski token adları temaya duyarlı */
  --teal:var(--marka-teal); --teal2:var(--teal-700); --green:var(--vurgu); --green-d:var(--vurgu-hover);
  --ink:var(--metin); --white:var(--yuzey-1); --card:var(--yuzey-1); --paper:var(--zemin);
  --line:var(--cizgi); --line2:var(--cizgi-guclu); --muted:var(--metin-silik); --red:var(--hata); --amber:var(--uyari);
  --teal-08:var(--yuzey-3); --focus:0 0 0 3px rgba(49,174,72,.22); --sh:var(--golge); --sh-lg:var(--golge-cagri); --r:var(--r-lg);
}
[data-theme="koyu"]{
  --zemin:#0b1417; --yuzey-1:#111e23; --yuzey-2:#16272d; --yuzey-3:#1c3037; --yuzey-4:#223a42;
  --cizgi:#21353c; --cizgi-guclu:#2e4952; --cizgi-ucuncul:#3b5a64;
  --metin:#edf2f3; --metin-ikincil:#b8c4c8; --metin-silik:#8a9aa0; --metin-pasif:#5e7076;
  --vurgu-hover:#4bc763; --vurgu-zemin:#16301d; --vurgu-metin:#4bc763; --odak-halka:#4bc763;
  --basari:#4bc763; --basari-zemin:#16301d; --uyari:#e0a048; --uyari-zemin:#2e2413;
  --hata:#e8756a; --hata-zemin:#331916; --bilgi:#7fb3c4; --bilgi-zemin:#13272e; --notr:#8a9aa0; --notr-zemin:#1a2a30;
  --golge:0 4px 16px rgba(0,0,0,.5),0 1px 3px rgba(0,0,0,.5); --golge-cagri:0 8px 28px rgba(0,0,0,.6);
}
.durum-baslik{padding:10px 17px;font-size:12px;font-weight:600;color:var(--muted);border-bottom:1px solid var(--line);background:var(--yuzey-2)}
.durum-baslik.ic{color:var(--vurgu-metin)}
.tablo-alt{background:var(--yuzey-2)}
.saha-on{background:var(--vurgu-zemin);border-color:var(--vurgu)!important}
.gorev-dis{color:var(--vurgu-metin);font-weight:600}
*{box-sizing:border-box} html,body{margin:0;height:100%}
body{font-family:var(--font-govde);font-size:14px;line-height:1.55;color:var(--metin);background:var(--zemin);-webkit-font-smoothing:antialiased}
:focus-visible{outline:2px solid var(--odak-halka);outline-offset:2px;border-radius:var(--r-sm)}
.mono{font-family:var(--font-mono);font-size:12px}
/* Kabuk: üst çubuk + sol menü + içerik */
.app{display:grid;grid-template-columns:var(--menu-genislik) 1fr;grid-template-rows:var(--ust-cubuk) 1fr;height:100vh}
.ust{grid-column:1/3;display:flex;align-items:center;gap:var(--b3);padding:0 var(--b4);background:var(--yuzey-1);border-bottom:1px solid var(--cizgi);z-index:5}
.ust .logo{display:flex;align-items:center;gap:var(--b2);font-family:var(--font-baslik);font-weight:700;font-size:16px;letter-spacing:-.3px;color:var(--metin)} .ust .logo .wm{color:var(--metin)} .ust .logo .wm{background:none}
.ust .kare{width:28px;height:28px;border-radius:var(--r-md);background:var(--marka-teal);color:#fff;display:grid;place-items:center;font-size:11px;font-weight:700}
.ust .arama{flex:1;max-width:520px;margin-left:var(--b3)} .ust .arama input{width:100%;height:34px}
.ust .sag{margin-left:auto;display:flex;align-items:center;gap:var(--b2)}
.ikon-dugme{width:34px;height:34px;border:1px solid var(--cizgi);background:var(--yuzey-1);border-radius:var(--r-md);color:var(--metin-ikincil);cursor:pointer;display:grid;place-items:center;font-size:14px} .ikon-dugme:hover{background:var(--yuzey-2)}
.ust .avatar{width:30px;height:30px;border-radius:var(--r-pill);background:var(--vurgu-zemin);color:var(--vurgu-metin);display:grid;place-items:center;font-size:12px;font-weight:600;font-family:var(--font-govde)}
/* Sol menü */
.side{grid-row:2;grid-column:1;background:var(--menu-zemin);color:var(--menu-metin);display:flex;flex-direction:column;padding:var(--b2) 0;overflow-y:auto}
.brand{display:none}
nav{padding:var(--b2) var(--b2);display:flex;flex-direction:column;gap:1px;flex:1}
.nav-head{display:flex;align-items:center;justify-content:space-between;width:100%;background:none;border:none;color:var(--menu-grup);font-family:var(--font-govde);font-size:11px;letter-spacing:.06em;text-transform:uppercase;font-weight:600;padding:var(--b4) var(--b3) var(--b1);cursor:pointer;text-align:left}
.nav-head:hover{color:#cfe0e0} .nav-head .chev{font-size:10px;transition:transform var(--gecis);opacity:.6} .nav-sub{display:none}
.nav-item{display:flex;align-items:center;gap:10px;height:36px;padding:0 var(--b3);border-radius:0;color:var(--menu-metin);font-size:13px;font-weight:500;cursor:pointer;border:none;border-left:3px solid transparent;background:none;text-align:left;width:100%;transition:background var(--gecis)}
.nav-item:hover{background:var(--menu-hover);color:var(--menu-metin-aktif)}
.nav-item.active{background:var(--menu-secili);color:var(--menu-metin-aktif);border-left-color:var(--menu-serit);font-weight:600}
.nav-item .dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);flex-shrink:0} .nav-item.active .dot{background:var(--vurgu)}
.side-foot{padding:var(--b3) var(--b4) var(--b1);border-top:1px solid var(--menu-cizgi);font-size:11px;color:var(--menu-grup);display:flex;flex-direction:column;gap:var(--b2)}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--vurgu);position:relative} .pulse::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1px solid var(--vurgu);opacity:.5;animation:p 2.4s infinite}
@keyframes p{0%{transform:scale(.6);opacity:.7}100%{transform:scale(1.7);opacity:0}}
#navSearch{width:100%;box-sizing:border-box;height:34px}
/* İçerik */
main{grid-row:2;grid-column:2;overflow-y:auto;padding:var(--b5) var(--b6) var(--b6)}
.top{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:var(--b5);gap:var(--b4);flex-wrap:wrap}
h1{font-family:var(--font-baslik);font-size:24px;font-weight:600;margin:0;color:var(--metin);letter-spacing:-.5px}
.desc{font-size:13px;color:var(--metin-silik);margin-top:var(--b1)}
.badge{font-family:var(--font-mono);font-size:11px;color:var(--metin-ikincil);background:var(--yuzey-3);border:1px solid var(--cizgi);padding:5px 11px;border-radius:var(--r-pill)}
.view{display:none;animation:fade .2s} .view.active{display:block} @keyframes fade{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--b4);margin-bottom:var(--b5)}
.kpi{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-lg);padding:var(--b4) var(--b4)}
.kpi .lab{font-size:12px;color:var(--metin-silik);font-weight:500} .kpi .val{font-family:var(--font-baslik);font-size:28px;font-weight:600;color:var(--metin);margin-top:var(--b2);line-height:1;font-variant-numeric:tabular-nums}
.kpi .val.ok{color:var(--vurgu-metin)} .kpi .sub{font-size:12px;color:var(--metin-silik);margin-top:var(--b2)}
.cols{display:grid;grid-template-columns:1.4fr 1fr;gap:var(--b4);align-items:start}
.panel{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-lg);overflow:hidden;margin-bottom:var(--b4)}
.panel h2{font-family:var(--font-baslik);font-size:14px;font-weight:600;color:var(--metin);margin:0;padding:var(--b3) var(--b4);border-bottom:1px solid var(--cizgi);display:flex;justify-content:space-between;align-items:center;gap:var(--b2)}
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-weight:500;color:var(--metin-silik);font-size:12px;letter-spacing:.2px;text-transform:none;padding:0 var(--b4);height:38px;border-bottom:1px solid var(--cizgi);background:var(--yuzey-2);white-space:nowrap}
td{padding:0 var(--b4);height:40px;border-bottom:1px solid var(--cizgi);vertical-align:middle} tr:last-child td{border-bottom:none} tbody tr:hover td{background:var(--yuzey-2)}
tbody tr.click{cursor:pointer}
.stat{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:500} .stat .d{width:8px;height:8px;border-radius:50%}
.on .d{background:var(--vurgu)} .on{color:var(--vurgu-metin)} .off .d{background:var(--metin-pasif)} .off{color:var(--metin-silik)}
.tag{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:500;padding:2px 9px;border-radius:var(--r-pill);border:none;margin:1px;background:var(--notr-zemin);color:var(--notr);line-height:1.6}
.tag.g{background:var(--basari-zemin);color:var(--basari)} .tag.r{background:var(--hata-zemin);color:var(--hata)} .tag.a{background:var(--uyari-zemin);color:var(--uyari)}
.tag.t{background:var(--bilgi-zemin);color:var(--bilgi)} .tag.m{background:var(--notr-zemin);color:var(--notr)}
.btn{font-family:var(--font-govde);font-size:13px;font-weight:500;color:#fff;background:var(--marka-teal);border:1px solid var(--marka-teal);border-radius:var(--r-md);padding:0 var(--b4);height:34px;cursor:pointer;transition:background var(--gecis);display:inline-flex;align-items:center;gap:var(--b2);line-height:1}
.btn:hover{background:var(--teal-700);border-color:var(--teal-700)} .btn:active{transform:translateY(1px)} .btn:focus-visible{outline:none;box-shadow:var(--focus)}
.btn.g{background:var(--vurgu);border-color:var(--vurgu)} .btn.g:hover{background:var(--vurgu-hover);border-color:var(--vurgu-hover)}
.btn.o{background:var(--yuzey-1);color:var(--metin);border:1px solid var(--cizgi-guclu)} .btn.o:hover{background:var(--yuzey-2)}
@keyframes bp-spin{to{transform:rotate(360deg)}}
.btn .spin{width:14px;height:14px;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:bp-spin .55s linear infinite;flex-shrink:0}
.btn.o .spin{border-color:var(--cizgi-guclu);border-top-color:var(--metin)}
.btn.inv .spin{border-color:rgba(179,38,30,.28);border-top-color:#b3261e}
.filtre{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 16px;border-bottom:1px solid var(--cizgi);background:var(--yuzey-2)}
.filtre select,.filtre input{min-width:140px;height:32px}
.kapi-islem{border:1px solid var(--cizgi);border-radius:8px;padding:10px 12px;background:var(--yuzey-1)}
.kapi-islem .kis{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.kapi-btnler{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
input[type=text],input[type=number],input[type=date],input[type=time],input[type=password],select,textarea,#navSearch,.ust .arama input{font-family:var(--font-govde);font-size:13px;color:var(--metin);background:var(--yuzey-2);border:1px solid var(--cizgi);border-radius:var(--r-md);padding:0 var(--b3);height:34px;transition:var(--gecis);outline:none}
.alan input,.field input,.field select,.field textarea{background:var(--yuzey-1);border-color:var(--cizgi-guclu)}
textarea{height:auto;min-height:74px;padding:var(--b2) var(--b3);resize:vertical}
input:focus,select:focus,textarea:focus,#navSearch:focus{border-color:var(--vurgu);box-shadow:var(--focus)}
input.mono,input[type=number],input[type=time],input[type=date]{font-family:var(--font-mono)}
label{font-size:13px;color:var(--metin-silik)}
.feed{max-height:340px;overflow:auto} .ev{display:flex;gap:var(--b3);padding:11px var(--b4);border-bottom:1px solid var(--cizgi);font-size:13px;align-items:baseline} .ev:last-child{border-bottom:none}
.ev .t{font-family:var(--font-mono);font-size:12px;color:var(--metin-silik);white-space:nowrap} .ev .who{font-weight:600}
.ev .arr{font-family:var(--font-mono);font-weight:600} .ev .arr.in{color:var(--vurgu-metin)} .ev .arr.out{color:var(--metin-silik)} .ev .arr.no{color:var(--hata)}
.calc{padding:var(--b4);display:grid;grid-template-columns:1fr 1fr;gap:var(--b5);align-items:start} .calc .inp{display:flex;flex-direction:column;gap:var(--b3)}
.field{display:flex;justify-content:space-between;align-items:center;gap:var(--b3)}
.calc .out{background:var(--marka-teal);border-radius:var(--r-lg);padding:var(--b4);color:rgba(255,255,255,.82)} .calc .out .row{display:flex;justify-content:space-between;padding:6px 0;font-size:13px;border-bottom:1px solid rgba(255,255,255,.1)} .calc .out .row:last-child{border-bottom:none} .calc .out .row b{font-family:var(--font-mono);color:#fff;font-weight:600} .calc .out .row.big b{color:var(--vurgu-acik,#4bc763);font-size:16px} .calc .out .row.fm b{color:#F2C94C}
.note{font-size:12px;color:var(--metin-silik);line-height:1.6;padding:0 var(--b4) var(--b4)} .warnbar{margin:0 var(--b4) var(--b4);display:flex;flex-direction:column;gap:var(--b2)}
.wb{display:flex;align-items:center;gap:var(--b2);font-size:12.5px;padding:9px var(--b3);border-radius:var(--r-md);line-height:1.5;border:1px solid transparent}
.wb.err{background:var(--hata-zemin);color:var(--hata)} .wb.ok{background:var(--basari-zemin);color:var(--basari)} .wb.info{background:var(--bilgi-zemin);color:var(--bilgi)}
.presets{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--b3);padding:var(--b4)}
.pcard{background:var(--yuzey-1);border:1px solid var(--cizgi-guclu);border-radius:var(--r-md);padding:var(--b3) var(--b4);cursor:pointer;transition:var(--gecis)} .pcard:hover{border-color:var(--vurgu)} .pcard.on{border-color:var(--vurgu);box-shadow:0 0 0 1px var(--vurgu) inset}
.pcard .pt{font-family:var(--font-baslik);font-weight:600;font-size:13.5px;color:var(--metin)} .pcard .pd{font-size:11.5px;color:var(--metin-silik);margin-top:5px;line-height:1.45} .pcard .pw{font-size:10.5px;color:var(--hata);margin-top:7px;font-weight:600}
.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--b3);padding:var(--b1) var(--b4) var(--b2)} .metric{background:var(--yuzey-2);border:1px solid var(--cizgi);border-radius:var(--r-md);padding:11px var(--b3)}
.metric .ml{font-size:11px;color:var(--metin-silik)} .metric .mv{font-family:var(--font-baslik);font-size:20px;font-weight:600;color:var(--metin);margin-top:3px;font-variant-numeric:tabular-nums} .metric .mv.warn{color:var(--hata)} .metric .mv.ok{color:var(--vurgu-metin)}
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;padding:var(--b3) var(--b4)} .chh{font-size:10.5px;font-weight:600;color:var(--metin-silik);text-align:center;text-transform:uppercase}
.day{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-md);padding:7px 8px;min-height:58px} .day.work{border-left:3px solid var(--vurgu)} .day.rest{background:var(--yuzey-2);color:var(--metin-silik)}
.day.hol{border:1px solid var(--hata);background:var(--hata-zemin)} .day.holwork{border:1px solid var(--hata);border-left:3px solid var(--uyari);background:var(--uyari-zemin)}
.day .dn{font-family:var(--font-mono);font-size:11.5px;font-weight:600} .day .ds{font-size:10px;color:var(--metin-silik);margin-top:3px;line-height:1.3} .day .dhol{font-size:9.5px;color:var(--hata);font-weight:600;margin-top:1px}
.zone{display:grid;grid-template-columns:repeat(auto-fill,minmax(248px,1fr));gap:var(--b4);padding:2px}
.zc{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-lg);padding:var(--b4);border-left:4px solid var(--marka-teal)} .zc.bsl{border-left-color:var(--vurgu)} .zc.ofis{border-left-color:var(--metin-silik)}
.zc .zt{font-family:var(--font-baslik);font-weight:600;color:var(--metin);font-size:15px} .zc .zl{font-size:12px;color:var(--metin-silik);margin:5px 0 11px}
.zc .zr{display:flex;justify-content:space-between;font-size:12.5px;padding:3px 0} .zc .names{font-size:11px;color:var(--metin-silik);margin-top:8px;border-top:1px solid var(--cizgi);padding-top:8px;line-height:1.5}
#ov{position:fixed;inset:0;background:rgba(11,20,23,.55);backdrop-filter:blur(2px);display:none;align-items:flex-start;justify-content:center;padding:34px 16px;z-index:60;overflow:auto} #ov.show{display:flex}
.modal,#modal{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-xl);max-width:900px;width:100%;overflow:hidden;box-shadow:var(--golge-cagri)} #modal{max-width:760px}
.mhead{background:var(--marka-teal);color:#fff;padding:var(--b4) var(--b5);display:flex;gap:var(--b4);align-items:center}
.avatar{width:56px;height:56px;border-radius:50%;background:var(--vurgu);display:flex;align-items:center;justify-content:center;font-family:var(--font-baslik);font-weight:700;font-size:21px;flex-shrink:0}
.mhead .nm{font-family:var(--font-baslik);font-size:20px;font-weight:600} .mhead .rl{color:#9FB8BA;font-size:13px;margin-top:2px}
.mclose{margin-left:auto;background:rgba(255,255,255,.14);border:none;color:#fff;width:34px;height:34px;border-radius:var(--r-md);cursor:pointer;font-size:16px} .mclose:hover{background:rgba(255,255,255,.24)}
.mbody{padding:var(--b4);display:grid;grid-template-columns:1fr 1fr;gap:var(--b3)}
.mbox{background:var(--yuzey-1);border:1px solid var(--cizgi);border-radius:var(--r-md);padding:var(--b3) var(--b4)} .mbox.full{grid-column:1/3}
.mbox h4{font-family:var(--font-baslik);font-size:11.5px;font-weight:600;color:var(--metin);margin:0 0 11px;text-transform:uppercase;letter-spacing:.05em}
.izin-big{display:grid;grid-template-columns:repeat(3,1fr);gap:9px} .ib{background:var(--yuzey-2);border-radius:var(--r-md);padding:11px;text-align:center}
.ib .l{font-size:10.5px;color:var(--metin-silik)} .ib .v{font-family:var(--font-baslik);font-size:24px;font-weight:600;color:var(--metin);margin-top:3px} .ib .v.ok{color:var(--vurgu-metin)} .ib .v.z{color:var(--metin-silik)}
.chk{display:flex;justify-content:space-between;align-items:center;padding:7px 0;border-bottom:1px solid var(--cizgi);font-size:12.5px} .chk:last-child{border-bottom:none} .chk small{color:var(--metin-silik);font-size:10.5px;display:block}
.idmeta{display:grid;grid-template-columns:repeat(3,1fr);gap:9px var(--b4);font-size:12px} .idmeta .k{color:var(--metin-silik);font-size:10.5px} .idmeta .v{font-family:var(--font-mono);margin-top:2px}
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:var(--marka-teal);color:#fff;padding:12px 20px;border-radius:var(--r-lg);font-size:13px;font-weight:500;opacity:0;pointer-events:none;transition:.25s;z-index:70;display:flex;gap:9px;align-items:center;box-shadow:var(--golge-cagri)} #toast.show{opacity:1;transform:translateX(-50%) translateY(0)} #toast .k{width:8px;height:8px;border-radius:50%;background:var(--vurgu)}
@media (max-width:980px){.app{grid-template-columns:1fr}.side{display:none}.kpis,.metrics{grid-template-columns:repeat(2,1fr)}.cols,.calc{grid-template-columns:1fr}.mbody{grid-template-columns:1fr}.mbox.full{grid-column:auto}main{padding:var(--b4)}.ust .arama{display:none}}
@media print{ body *{visibility:hidden} #ov{position:static!important;background:none!important;padding:0!important;display:block!important} .modal{max-width:100%!important;box-shadow:none} .mhead{display:none!important} #bordroPrint,#bordroPrint *{visibility:visible} #bordroPrint{position:absolute;left:0;top:0;width:100%} }
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}