:root{
  --zemin:#0a0c0f; --zemin-2:#101318; --yuzey:#14181e;
  --cizgi:#242a33; --cizgi-acik:#333b47;
  --metin:#dfe3e9; --metin-2:#949cab; --metin-3:#6b7382;
  --vurgu:#c9552d; --vurgu-acik:#e07149;
  --celik:#5b7a99; --uyari:#c8923a; --olumlu:#4f8f6a; --tehlike:#c0453a;
  --mono:ui-monospace,"Cascadia Mono","SF Mono",Menlo,Consolas,monospace;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --en:1120px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--zemin);color:var(--metin);font-family:var(--sans);font-size:clamp(1rem,.92rem + .4vw,1.0625rem);line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration:none}
.kap{max-width:var(--en);margin:0 auto;padding:0 24px}
.mono{font-family:var(--mono)}
.etiket{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--metin-3)}

/* üst çubuk */
header{position:sticky;top:0;z-index:20;background:rgba(10,12,15,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--cizgi)}
.ust{display:flex;align-items:center;justify-content:space-between;height:60px;gap:20px}
.logo{display:flex;align-items:center;gap:10px}
.logo svg{width:22px;height:22px;flex:none}
.logo b{font-weight:700;letter-spacing:-.01em;font-size:.98rem}
.logo span{font-family:var(--mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--metin-3)}
nav ul{display:flex;gap:26px;list-style:none;font-size:.86rem;color:var(--metin-2)}
nav a:hover{color:var(--metin)}
.menu-dugme{display:none;background:none;border:1px solid var(--cizgi-acik);color:var(--metin);border-radius:3px;padding:6px 9px;cursor:pointer;font-family:var(--mono);font-size:.7rem;letter-spacing:.1em}

/* giriş */
.giris{padding:96px 0 0}
.rozet{display:inline-flex;align-items:center;gap:10px;padding:6px 14px;border:1px solid var(--cizgi-acik);border-radius:999px;font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--metin-2)}
.rozet i{width:6px;height:6px;border-radius:50%;background:var(--olumlu);display:block}
h1{font-size:clamp(2.3rem,1.4rem + 3.6vw,3.6rem);font-weight:650;letter-spacing:-.022em;line-height:1.08;margin:26px 0 24px;max-width:15ch}
.giris p.oz{color:var(--metin-2);max-width:60ch;font-size:1.05rem}
.dugmeler{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.dugme{display:inline-block;padding:11px 18px;border-radius:3px;font-size:.88rem;font-weight:600;border:1px solid transparent;transition:background .15s,border-color .15s}
.dugme.ana{background:var(--vurgu);color:#fff}
.dugme.ana:hover{background:var(--vurgu-acik)}
.dugme.ikincil{border-color:var(--cizgi-acik);color:var(--metin)}
.dugme.ikincil:hover{border-color:var(--metin-3)}
.olcu{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--cizgi);margin-top:64px;background:var(--zemin-2)}
.olcu div{padding:22px 24px;border-right:1px solid var(--cizgi)}
.olcu div:last-child{border-right:0}
.olcu b{display:block;font-size:2rem;font-weight:650;letter-spacing:-.02em;line-height:1.1}
.olcu span{display:block;margin-top:6px}

/* bölümler */
section.bolum{padding:96px 0;border-top:1px solid var(--cizgi)}
.baslik{display:grid;grid-template-columns:56px 1fr;gap:0 18px;max-width:760px;margin-bottom:48px}
.baslik .no{font-family:var(--mono);font-size:.72rem;color:var(--vurgu);padding-top:14px;position:relative}
.baslik .no::before{content:"";position:absolute;top:0;left:0;width:44px;height:1px;background:var(--vurgu)}
.baslik h2{font-size:clamp(1.55rem,1.1rem + 1.5vw,2.1rem);font-weight:650;letter-spacing:-.018em;line-height:1.2}
.baslik p{grid-column:2;color:var(--metin-2);margin-top:12px;font-size:.98rem;max-width:62ch}

.uclu{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kart{border:1px solid var(--cizgi);background:var(--zemin-2);padding:26px;border-radius:3px}
.kart .harf{font-family:var(--mono);font-size:.75rem;color:var(--vurgu);border:1px solid var(--cizgi-acik);width:28px;height:28px;display:grid;place-items:center;border-radius:2px;margin-bottom:18px}
.kart h3{font-size:1.02rem;font-weight:650;margin-bottom:10px;letter-spacing:-.005em}
.kart p{color:var(--metin-2);font-size:.9rem}

/* şekil */
figure{border:1px solid var(--cizgi);background:var(--zemin-2);padding:34px;border-radius:3px}
figcaption{font-family:var(--mono);font-size:.72rem;color:var(--metin-3);margin-top:26px;line-height:1.6}
figcaption b{color:var(--metin-2);font-weight:500}
.sema{display:grid;grid-template-columns:1fr 64px 1.1fr 64px 1fr;align-items:center}
.kolon{display:grid;gap:18px}
.kutu{border:1px solid var(--cizgi-acik);background:var(--yuzey);padding:14px 16px;border-radius:3px}
.kutu h4{font-size:.88rem;font-weight:650;margin-bottom:6px}
.kutu .etiket{font-size:.6rem;line-height:1.7}
.kutu.merkez{border-color:var(--vurgu);box-shadow:0 0 0 1px rgba(201,85,45,.25)}
.kutu.dis{border-style:dashed}
.ok{height:100%;display:flex;align-items:center;justify-content:center;color:var(--metin-3)}
.ok svg{width:100%;height:120px}

/* tablo */
.tablo{border:1px solid var(--cizgi);border-radius:3px;overflow:hidden}
.satir{display:grid;grid-template-columns:220px 1fr 160px;gap:20px;padding:16px 22px;border-top:1px solid var(--cizgi);align-items:center;font-size:.9rem}
.satir:first-child{border-top:0}
.satir.bas{background:var(--zemin-2);padding-top:12px;padding-bottom:12px}
.satir b{font-weight:650}
.satir .ac{color:var(--metin-2)}
.satir .kod{font-family:var(--mono);font-size:.7rem;color:var(--metin-3);text-align:right}

/* hat */
.hat{display:grid;grid-template-columns:repeat(5,1fr) 24px 1.2fr;gap:10px;align-items:stretch}
.adim{border:1px solid var(--cizgi-acik);background:var(--yuzey);padding:14px;border-radius:3px}
.adim .etiket{color:var(--vurgu);font-size:.62rem}
.adim h4{font-size:.9rem;font-weight:650;margin:6px 0 4px}
.adim .etiket.alt{color:var(--metin-3);font-size:.58rem}
.hat .ok2{display:flex;align-items:center;justify-content:center;color:var(--metin-3);font-family:var(--mono)}
.adim.son{border-color:var(--vurgu)}
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}

/* deneme */
.deneme{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--cizgi);border-radius:3px;overflow:hidden}
.panel{display:flex;flex-direction:column;min-height:300px;background:var(--zemin-2)}
.panel+.panel{border-left:1px solid var(--cizgi)}
.panel-bas{display:flex;justify-content:space-between;align-items:center;padding:12px 18px;border-bottom:1px solid var(--cizgi)}
textarea{flex:1;background:transparent;border:0;outline:0;resize:none;color:var(--metin);font:.86rem/1.75 var(--mono);padding:18px}
textarea:focus{background:var(--yuzey)}
.cikti{flex:1;padding:18px;font:.86rem/1.75 var(--mono);white-space:pre-wrap;word-break:break-word;color:var(--metin)}
.cikti mark{background:rgba(91,122,153,.18);color:#9db8d3;padding:0 4px;border-radius:2px}
.cikti mark.eng{background:rgba(192,69,58,.16);color:#e58a80}
.karar{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;padding:4px 9px;border-radius:2px;border:1px solid}
.k-izin{color:var(--olumlu);border-color:rgba(79,143,106,.5)}
.k-mask{color:var(--uyari);border-color:rgba(200,146,58,.5)}
.k-eng{color:var(--tehlike);border-color:rgba(192,69,58,.6)}
.bulgu{border-top:1px solid var(--cizgi);padding:12px 18px;display:flex;gap:8px;flex-wrap:wrap;min-height:46px;align-items:center}
.bulgu span{font-family:var(--mono);font-size:.66rem;letter-spacing:.06em;padding:3px 8px;border:1px solid var(--cizgi-acik);border-radius:2px;color:var(--metin-2)}
.ornekler{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.ornekler button{background:none;border:1px solid var(--cizgi-acik);color:var(--metin-2);border-radius:3px;padding:7px 12px;font:.8rem var(--sans);cursor:pointer}
.ornekler button:hover{border-color:var(--vurgu);color:var(--metin)}

/* sınırlar */
.sinir{border:1px solid var(--cizgi);border-left:2px solid var(--uyari);background:var(--zemin-2);padding:26px 28px;border-radius:3px}
.sinir ul{list-style:none;display:grid;gap:14px;margin-top:14px}
.sinir li{display:grid;grid-template-columns:18px 1fr;gap:10px;color:var(--metin-2);font-size:.92rem}
.sinir li::before{content:"—";color:var(--uyari);font-family:var(--mono)}
.sinir li b{color:var(--metin);font-weight:600}

/* iletişim */
.liste{list-style:none;display:grid;gap:10px;margin-top:14px}
.liste li{display:grid;grid-template-columns:14px 1fr;gap:10px;color:var(--metin-2);font-size:.9rem}
.liste li::before{content:"";width:6px;height:6px;background:var(--vurgu);margin-top:.6em}
.gelistirici{display:grid;grid-template-columns:1fr auto;gap:30px;align-items:center;border:1px solid var(--cizgi);background:var(--zemin-2);padding:30px;border-radius:3px;margin-top:16px}
.gelistirici h3{font-size:1.25rem;font-weight:650;letter-spacing:-.01em;margin:6px 0 8px}
.gelistirici p{color:var(--metin-2);font-size:.92rem;max-width:64ch}
.eposta{display:inline-flex;align-items:center;gap:10px;padding:13px 20px;border:1px solid var(--vurgu);border-radius:3px;font-family:var(--mono);font-size:.9rem;color:var(--metin);white-space:nowrap}
.eposta:hover{background:var(--vurgu);color:#fff}

footer{border-top:1px solid var(--cizgi);padding:28px 0;color:var(--metin-3);font-size:.8rem}
.alt{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}

@media (max-width:960px){
  .uclu{grid-template-columns:1fr}
  .olcu{grid-template-columns:1fr 1fr}
  .olcu div:nth-child(2){border-right:0}
  .olcu div:nth-child(-n+2){border-bottom:1px solid var(--cizgi)}
  .sema{grid-template-columns:1fr;gap:10px}
  .ok{height:28px}.ok svg{display:none}
  .ok::after{content:"↓";font-family:var(--mono)}
  .hat{grid-template-columns:1fr 1fr}
  .hat .ok2{grid-column:1/-1;height:20px}
  .hat .ok2{transform:rotate(90deg)}
  .adim.son{grid-column:1/-1}
  .satir{grid-template-columns:1fr;gap:4px}
  .satir.bas{display:none}
  .satir .kod{text-align:left}
  .ikili,.deneme{grid-template-columns:1fr}
  .panel+.panel{border-left:0;border-top:1px solid var(--cizgi)}
  .gelistirici{grid-template-columns:1fr}
}
@media (max-width:720px){
  .kap{padding:0 16px}
  nav ul{display:none}
  .menu-dugme{display:block}
  header.acik nav ul{display:flex;flex-direction:column;gap:16px;position:absolute;top:60px;left:0;right:0;padding:20px 16px;background:var(--zemin);border-bottom:1px solid var(--cizgi)}
  .giris{padding-top:64px}
  section.bolum{padding:72px 0}
  .baslik{grid-template-columns:1fr}
  .baslik .no{margin-bottom:14px}
  .baslik p{grid-column:1}
  figure{padding:18px}
  .logo span{display:none}
  .eposta{white-space:normal;word-break:break-all}
}

/* satır içi stil yerine sınıflar (CSP style-src 'self') */
.ust-bosluk{margin-top:96px}
.ust-sifir{margin-top:0}
.sag{text-align:right}
.not{margin-top:14px;text-transform:none;letter-spacing:.02em}
.sayi{font-size:.95rem;color:var(--metin)}
.uyari-metin{color:var(--uyari)}
.tehlike-metin{color:var(--tehlike)}
.gri-metin{color:var(--metin-3)}
.yesil-bulgu{color:var(--olumlu);border-color:rgba(79,143,106,.5)}
