:root{--zemin:#f5f6f8;--kutu:#fff;--yazi:#1d2330;--sol:#6b7280;--cizgi:#e3e6eb;--vurgu:#f27a1a;
--yesil:#0a7a2f;--yesil-z:#e6f4ea;--kirmizi:#b00020;--kirmizi-z:#fde8eb;--sari:#8a5a00;--sari-z:#fff4d6;--gri:#555;--gri-z:#eceef1}
@media (prefers-color-scheme:dark){:root{--zemin:#14171c;--kutu:#1d2128;--yazi:#e6e8eb;--sol:#9aa2ad;--cizgi:#2d333c;
--yesil:#5fd38a;--yesil-z:#183524;--kirmizi:#ff7d8f;--kirmizi-z:#3d1a21;--sari:#ffcf6b;--sari-z:#3a2f12;--gri:#b8bec7;--gri-z:#2a2f37}}
*{box-sizing:border-box}body{margin:0;background:var(--zemin);color:var(--yazi);font:14px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--vurgu);text-decoration:none}a:hover{text-decoration:underline}
header{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding:10px 16px;background:var(--kutu);border-bottom:1px solid var(--cizgi);position:sticky;top:0;z-index:5}
header b{font-size:17px;color:var(--vurgu)}nav{display:flex;flex-wrap:wrap;gap:4px}nav a{padding:6px 10px;border-radius:6px;color:var(--yazi)}
nav a.aktif{background:var(--vurgu);color:#fff}.cikis{margin-left:auto;color:var(--sol)}
main{padding:16px;max-width:1400px;margin:0 auto}h1{font-size:22px;margin:4px 0 14px}h2{font-size:15px;margin:0 0 10px}
.kutu{background:var(--kutu);border:1px solid var(--cizgi);border-radius:10px;padding:14px;margin-bottom:14px;overflow:auto}
.ikili{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:14px}.ikili .kutu{margin-bottom:0}.ikili{margin-bottom:14px}
.kartlar{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-bottom:14px}
.kart{display:flex;flex-direction:column;padding:14px;border-radius:10px;border:1px solid var(--cizgi);background:var(--kutu);color:var(--yazi)}
.kart b{font-size:28px}.kart span{font-weight:600}.kart.yesil span{color:var(--yesil)}.kart.kirmizi span{color:var(--kirmizi)}.kart.sari span{color:var(--sari)}.kart.gri span{color:var(--gri)}
table{border-collapse:collapse;width:100%}td,th{padding:6px 8px;border-bottom:1px solid var(--cizgi);text-align:left;vertical-align:top}th{color:var(--sol);font-weight:600;white-space:nowrap}
.n{text-align:right;white-space:nowrap}.tablo{overflow-x:auto;background:var(--kutu);border:1px solid var(--cizgi);border-radius:10px}
small,.sol{color:var(--sol)}.soluk{opacity:.55}
.rozet{display:inline-block;padding:2px 8px;border-radius:99px;font-size:12px;font-weight:600;white-space:nowrap}
.rozet.yesil{background:var(--yesil-z);color:var(--yesil)}.rozet.kirmizi{background:var(--kirmizi-z);color:var(--kirmizi)}.rozet.sari{background:var(--sari-z);color:var(--sari)}.rozet.gri{background:var(--gri-z);color:var(--gri)}
.uyari{background:var(--sari-z);color:var(--yazi);border:1px solid var(--sari);border-radius:10px;padding:12px 14px;margin-bottom:14px}
.hata{color:var(--kirmizi)}
input,select,button{font:inherit;padding:7px 10px;border:1px solid var(--cizgi);border-radius:6px;background:var(--kutu);color:var(--yazi)}
button{background:var(--vurgu);border-color:var(--vurgu);color:#fff;cursor:pointer}
.filtre{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}.filtre input[name=q]{flex:1;min-width:180px}
.elle{display:flex;gap:4px}.elle input{width:72px;padding:4px 6px}.elle button{padding:4px 8px}
table.urun td:first-child{min-width:260px}
.sayfalama{display:flex;flex-wrap:wrap;gap:4px;margin:12px 0}.sayfalama a{padding:4px 9px;border:1px solid var(--cizgi);border-radius:6px;background:var(--kutu)}.sayfalama a.aktif{background:var(--vurgu);color:#fff}
.resimler{display:flex;gap:8px;overflow-x:auto;margin-bottom:14px}.resimler img{height:140px;border-radius:8px;border:1px solid var(--cizgi)}
pre{white-space:pre-wrap;font-size:13px}
body.giris{display:grid;place-items:center;min-height:100vh;padding:16px}.girisform{width:100%;max-width:340px;display:flex;flex-direction:column;gap:10px}
.girisform h1{margin:0;color:var(--vurgu)}
.gorseller{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:10px}
.gorseller figure{margin:0;border:1px solid var(--cizgi);border-radius:8px;padding:6px;background:var(--zemin)}
.gorseller img{width:100%;aspect-ratio:1;object-fit:contain;border-radius:6px;background:#fff}
.gorseller figcaption{font-size:12px;margin-top:4px}.gorseller .elle{margin-top:4px}.gorseller .elle button{flex:1;font-size:12px}
.ok{color:var(--yesil)}.aciklama{margin-top:8px}details summary{cursor:pointer;color:var(--vurgu)}