:root{
  --arka:#101319; --kat:#181c25; --kat2:#1f2430; --cizgi:#2c3340;
  --yazi:#e3e6ec; --sonuk:#98a1b3; --vurgu:#6fb2f0; --uyari:#e0a24e;
}
*{box-sizing:border-box}
body{margin:0;background:var(--arka);color:var(--yazi);
  font:15px/1.6 system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--vurgu);text-decoration:none}
a:hover{text-decoration:underline}
code{font-family:ui-monospace,"SF Mono",Menlo,monospace;font-size:.88em;
  background:var(--kat2);padding:1px 5px;border-radius:4px;color:#c8d3e2}

header{display:flex;flex-wrap:wrap;gap:14px;align-items:center;
  padding:12px 20px;background:var(--kat);border-bottom:1px solid var(--cizgi);
  position:sticky;top:0;z-index:5}
.marka{font-weight:600;color:var(--yazi);letter-spacing:.2px}
header nav{display:flex;gap:14px;font-size:14px}
header .ara{margin-left:auto;display:flex;gap:6px}
header input{background:var(--kat2);border:1px solid var(--cizgi);color:var(--yazi);
  padding:6px 10px;border-radius:6px;min-width:240px;font-size:14px}
button,.dugme{background:var(--kat2);border:1px solid var(--cizgi);color:var(--yazi);
  padding:6px 13px;border-radius:6px;cursor:pointer;font-size:14px}
button:hover,.dugme:hover{border-color:var(--vurgu)}
button.birincil{background:#1d4f7d;border-color:#2b6ea8}

main{max-width:1080px;margin:0 auto;padding:26px 20px 60px}
h1{font-size:22px;margin:0 0 4px}
h2{font-size:16px;margin:30px 0 10px;color:#c3cbd9;
  border-bottom:1px solid var(--cizgi);padding-bottom:6px}
h3{font-size:14px;margin:18px 0 6px;color:var(--sonuk);
  text-transform:uppercase;letter-spacing:.06em}
p{margin:8px 0}
.sonuk{color:var(--sonuk)}
.kucuk{font-size:13px}

.kart{background:var(--kat);border:1px solid var(--cizgi);border-radius:9px;
  padding:14px 16px;margin:12px 0}
.izgara{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(215px,1fr))}
.kutu{background:var(--kat);border:1px solid var(--cizgi);border-radius:9px;padding:12px 14px}
.kutu .sayi{font-size:24px;font-weight:600}
.kutu .etiket{font-size:13px;color:var(--sonuk)}

table{width:100%;border-collapse:collapse;font-size:14px}
th,td{text-align:left;padding:7px 10px;border-bottom:1px solid var(--cizgi);
  vertical-align:top}
th{color:var(--sonuk);font-weight:500;font-size:13px}
tr:hover td{background:#161a22}

.rozet{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;
  background:var(--kat2);border:1px solid var(--cizgi);color:#c4cddb}
.rozet.Kisi{background:#1d3a55;border-color:#2b5a83}
.rozet.Iddia{background:#4a3d18;border-color:#7a6528}
.rozet.Pasaj{background:#1e3f26;border-color:#2f6339}
.rozet.Olay{background:#4d2222;border-color:#7e3636}
.rozet.Eser,.rozet.Nusha{background:#3a2c4d;border-color:#5b467a}
.rozet.GriAlan{background:#2c3038;border-color:#454c58}
.rozet.Hipotez{background:#153f3f;border-color:#256767}

.skor{font-variant-numeric:tabular-nums;font-weight:600}
.cubuk{display:inline-block;height:6px;border-radius:3px;background:#2c3340;
  width:90px;vertical-align:middle;overflow:hidden}
.cubuk i{display:block;height:100%;background:linear-gradient(90deg,#8a5a2b,#4e9c5c)}

.arapca{direction:rtl;text-align:right;font-size:17px;line-height:2;
  font-family:"Amiri","Scheherazade New","Noto Naskh Arabic",serif}

.uyari{border-left:3px solid var(--uyari);background:#241d10;padding:10px 14px;
  border-radius:0 7px 7px 0;margin:14px 0;font-size:14px}
.bilgi{border-left:3px solid var(--vurgu);background:#121e2b;padding:10px 14px;
  border-radius:0 7px 7px 0;margin:14px 0;font-size:14px}

form.katki{display:grid;gap:10px;margin-top:10px}
form.katki label{font-size:13px;color:var(--sonuk)}
form.katki select,form.katki input,form.katki textarea{
  background:var(--kat2);border:1px solid var(--cizgi);color:var(--yazi);
  padding:8px 10px;border-radius:6px;font:inherit;width:100%}
form.katki textarea{min-height:130px;resize:vertical}
.kavanoz{position:absolute;left:-9999px}

.katki-kayit{border:1px solid var(--cizgi);border-radius:8px;padding:12px 14px;
  margin:10px 0;background:var(--kat)}
.katki-kayit .bas{display:flex;gap:10px;flex-wrap:wrap;align-items:center;
  font-size:13px;color:var(--sonuk);margin-bottom:6px}
.katki-kayit .govde{white-space:pre-wrap}
.vurgu-yeni{outline:2px solid var(--vurgu)}

.sayfalama{display:flex;gap:8px;align-items:center;margin:18px 0;font-size:14px}
footer{max-width:1080px;margin:0 auto;padding:18px 20px 40px;color:var(--sonuk);
  font-size:12.5px;border-top:1px solid var(--cizgi);display:flex;
  flex-wrap:wrap;gap:10px;justify-content:space-between}
#tuval{width:100%;height:74vh;background:var(--kat);border:1px solid var(--cizgi);
  border-radius:9px;display:block}
