:root{
  --gece:#2B2140; --gece-2:#3A2E55;
  --sikke:#B8895A; --sikke-acik:#D9B48A;
  --kamis:#9AA26A;
  --bg:#F2F0EC; --yuzey:#FFFFFF; --metin:#241E30; --soluk:#6A6275; --cizgi:#D8D2CB;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#1A1624; --yuzey:#221D2E; --metin:#EDE8F2; --soluk:#A69DB3; --cizgi:#3A3348;
  }
}
:root[data-theme="dark"]{
  --bg:#1A1624; --yuzey:#221D2E; --metin:#EDE8F2; --soluk:#A69DB3; --cizgi:#3A3348;
}
*,*::before,*::after{box-sizing:inherit}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{
  margin:0; background:var(--bg); color:var(--metin);
  font-family:"Alegreya Sans", "Segoe UI", system-ui, sans-serif;
  font-size:1.0625rem; line-height:1.55;
}
a{color:inherit}
:focus-visible{outline:2px solid var(--sikke); outline-offset:3px; border-radius:4px}
.kap{max-width:44rem; margin:0 auto; padding:0 1.25rem}

/* Üst şerit */
.ust{display:flex; justify-content:space-between; align-items:center; padding:1rem 0}
.logo{font-family:"Alegreya", Georgia, serif; font-weight:700; font-size:1.35rem; text-decoration:none; letter-spacing:.01em}
.ust nav a{font-size:.95rem; color:var(--soluk); text-decoration:none}

/* Hero */
.hero{
  background:var(--gece); color:#F3EEF7; border-radius:1.25rem;
  padding:1.75rem 1.5rem 2rem; position:relative; overflow:hidden;
}
.hero svg{width:100%; height:auto; display:block; margin:0 auto .5rem; max-width:26rem}
.hero h1{
  font-family:"Alegreya", Georgia, serif; font-weight:400;
  font-size:clamp(2rem, 7vw, 2.9rem); line-height:1.1; margin:.25rem 0 .75rem;
}
.hero p{margin:0; color:#CFC6DB; max-width:32rem}
.beyit{
  margin:1.5rem 0 0; padding-left:1rem; border-left:2px solid var(--sikke);
  font-family:"Alegreya", Georgia, serif; font-style:italic; color:var(--sikke-acik); font-size:1.1rem; line-height:1.6;
}
.beyit cite{display:block; font-style:normal; font-family:"Alegreya Sans", sans-serif; font-size:.85rem; color:#A99CB8; margin-top:.25rem}

.ses{stroke-dasharray:1; stroke-dashoffset:1; animation:ciz 3.2s ease-out .4s forwards}
@keyframes ciz{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion: reduce){ .ses{animation:none; stroke-dashoffset:0} }

/* Bölümler: kamışın boğumları gibi */
.bolumler{margin:2.5rem 0 1rem}
.bolumler > h2{font-family:"Alegreya", Georgia, serif; font-weight:500; font-size:1.5rem; margin:0 0 1rem}
.bolum{border-top:1px solid var(--cizgi)}
.bolum:last-child{border-bottom:1px solid var(--cizgi)}
.bolum summary{
  all:unset; box-sizing:border-box; cursor:pointer; width:100%;
  display:grid; grid-template-columns:auto 1fr auto; gap:1rem; align-items:center;
  padding:1.15rem .25rem;
}
.bogum{width:10px; height:34px; border-radius:5px; background:var(--kamis); position:relative}
.bogum::after{content:""; position:absolute; left:-3px; right:-3px; top:50%; height:3px; background:var(--sikke); border-radius:2px; transform:translateY(-50%)}
.bolum .baslik{font-family:"Alegreya", Georgia, serif; font-size:1.3rem; line-height:1.2}
.bolum .aciklama{display:block; font-family:"Alegreya Sans", sans-serif; font-size:.95rem; color:var(--soluk); margin-top:.15rem}
.isaret{width:1.5rem; height:1.5rem; transition:transform .25s ease; color:var(--soluk)}
.bolum[open] .isaret{transform:rotate(45deg)}
.alt{display:grid; grid-template-rows:0fr; transition:grid-template-rows .3s ease}
.bolum[data-acik="true"] .alt{grid-template-rows:1fr}
.alt > div{overflow:hidden}
.alt ul{list-style:none; margin:0; padding:0 0 1.1rem 2.1rem}
.alt li a{display:block; padding:.45rem 0; text-decoration:none; border-bottom:1px dashed var(--cizgi)}
.alt li:last-child a{border-bottom:0}
.alt li a:hover{color:var(--sikke)}
.alt li a small{color:var(--soluk); font-size:.85rem; margin-left:.35rem}
@media (prefers-reduced-motion: reduce){ .alt, .isaret{transition:none} }

/* İç sayfa */
.sayfa{padding:1rem 0 3rem}
.geri{display:inline-block; margin:.5rem 0 1.5rem; color:var(--soluk); text-decoration:none; font-size:.95rem}
.yol{font-size:.9rem; color:var(--soluk); margin:0}
.sayfa h1{font-family:"Alegreya", Georgia, serif; font-weight:500; font-size:clamp(2rem,6vw,2.6rem); line-height:1.15; margin:.25rem 0 1rem}
.sayfa article{font-family:"Alegreya", Georgia, serif; font-size:1.15rem; line-height:1.7}
.sayfa article h2{font-size:1.4rem; font-weight:500; margin:2rem 0 .5rem}
.sayfa .giris{font-size:1.25rem; color:var(--soluk)}
.kutu{background:var(--yuzey); border:1px solid var(--cizgi); border-radius:.75rem; padding:1rem 1.25rem; margin:1.5rem 0; font-family:"Alegreya Sans", sans-serif; font-size:1rem}
.kutu strong{display:block; margin-bottom:.25rem}
.bos{background:var(--yuzey); border:1px dashed var(--cizgi); border-radius:.75rem; padding:1.5rem; color:var(--soluk)}
.sonraki{margin-top:2.5rem; padding-top:1rem; border-top:1px solid var(--cizgi)}
.sonraki a{font-family:"Alegreya", Georgia, serif; font-size:1.2rem}

.ozet{display:grid; grid-template-columns:auto 1fr; gap:.3rem 1rem; margin:.25rem 0 0}
.ozet dt{color:var(--soluk)}
.ozet dd{margin:0}
.alinti{margin:1.5rem 0; padding:.25rem 0 .25rem 1.1rem; border-left:3px solid var(--sikke); font-style:italic; font-size:1.25rem; line-height:1.6; color:var(--metin)}
.ilgili{display:block; margin:1rem 0 .5rem; padding:.8rem 1rem; border-radius:.6rem; background:var(--yuzey); border:1px solid var(--cizgi); border-left:4px solid var(--kamis); text-decoration:none; font-family:"Alegreya Sans", sans-serif; font-weight:500}
.ilgili span{display:block; font-weight:400; font-size:.85rem; color:var(--soluk)}
.ilgili:hover{border-left-color:var(--sikke)}
.kapanis{margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--cizgi); font-size:1.25rem; line-height:1.65}
.zaman{list-style:none; margin:1.75rem 0 2rem; padding:0 0 0 2.6rem; position:relative; font-family:"Alegreya Sans", sans-serif}
.zaman::before{content:""; position:absolute; left:.7rem; top:.6rem; bottom:.4rem; width:10px; border-radius:0 0 5px 5px; background:linear-gradient(#E2C79A,#B8895A)}
.zaman::after{content:""; position:absolute; left:calc(.7rem - 2px); top:0; width:14px; height:14px; border-radius:4px 4px 2px 2px; background:#5E4A7A}
.zaman li{position:relative; padding:.2rem 0 1rem}
.zaman li:last-child{padding-bottom:0}
.zaman li::before{content:""; position:absolute; left:calc(-2.6rem + .7rem - 4px); top:.65rem; width:18px; height:4px; border-radius:2px; background:#8E6A45}
.zaman b{display:block; font-family:"Alegreya", Georgia, serif; font-weight:700; font-size:1.05rem; line-height:1.3}
.zaman span{color:var(--soluk); font-size:.98rem; line-height:1.4}
.cizim{margin:1.75rem 0; background:var(--gece); border-radius:1rem; padding:1.25rem 1rem 1rem; text-align:center}
.cizim svg{width:100%; max-width:15rem; height:auto; display:block; margin:0 auto}
.cizim figcaption{font-family:"Alegreya Sans", sans-serif; font-size:.92rem; color:#CFC6DB; margin-top:.5rem}
.ozet dd{line-height:1.4}
.cizim svg.sema-ney{max-width:20rem}
.ikili{display:grid; gap:.75rem; grid-template-columns:repeat(auto-fit,minmax(15rem,1fr)); margin:1rem 0}
.ikili .kutu{margin:0}
.cizim svg.yapim-svg{max-width:22rem}
.ara-baslik{font-family:"Alegreya Sans", sans-serif; font-size:.85rem; letter-spacing:.08em; text-transform:uppercase; color:var(--soluk); margin:2rem 0 -.5rem; font-weight:700}
.kutu.kisa{border-left:4px solid var(--sikke); margin-top:0}
cite{font-style:normal; font-family:"Alegreya Sans", sans-serif; font-size:.85em; color:var(--soluk); white-space:nowrap}
.kaynaklar{margin-top:3rem; padding-top:1rem; border-top:1px solid var(--cizgi)}
.kaynaklar h2{font-size:1.1rem !important; margin:0 0 .75rem !important}
.kaynaklar ul{list-style:none; margin:0; padding:0; font-family:"Alegreya Sans", sans-serif; font-size:.92rem; line-height:1.5; color:var(--soluk)}
.kaynaklar li{margin-bottom:.75rem; padding-left:1.5rem; text-indent:-1.5rem; overflow-wrap:anywhere}
.kaynaklar a{color:inherit}
.kontrol{margin:.4rem 0 0; padding-left:1.2rem}
.kontrol li{margin:.3rem 0}
.cizim svg.ahenk-svg{max-width:22rem}
.cizim svg.kp-svg{max-width:22rem}
.tablo-kap{overflow-x:auto; margin:1.5rem 0}
.karsilastirma{width:100%; border-collapse:collapse; font-family:"Alegreya Sans", sans-serif; font-size:.95rem; min-width:20rem}
.karsilastirma th,.karsilastirma td{padding:.55rem .6rem; border-bottom:1px solid var(--cizgi); text-align:left; vertical-align:top}
.karsilastirma thead th{font-weight:700; border-bottom:2px solid var(--sikke)}
.karsilastirma tbody th{color:var(--soluk); font-weight:500; white-space:nowrap}
.etkenler{display:grid; grid-template-columns:repeat(auto-fit,minmax(9.5rem,1fr)); gap:.6rem; margin:1.5rem 0; font-family:"Alegreya Sans", sans-serif}
.etkenler div{background:var(--yuzey); border:1px solid var(--cizgi); border-top:3px solid var(--kamis); border-radius:.6rem; padding:.7rem .8rem}
.etkenler b{display:block; font-size:1rem}
.etkenler span{display:block; color:var(--soluk); font-size:.88rem; line-height:1.35; margin-top:.15rem}
.cizim svg.tutus-svg{max-width:20rem}
.cizim svg.bakim-svg{max-width:22rem}
.kaynak-alt{display:block; font-style:normal; font-family:"Alegreya Sans", sans-serif; font-size:.85rem; color:var(--soluk); margin-top:.3rem}
.kutu.uyari{border-left:4px solid #C9735F}
h3.kisi{font-family:"Alegreya", Georgia, serif; font-size:1.2rem; font-weight:700; margin:1.6rem 0 .3rem}
h3.kisi span{font-family:"Alegreya Sans", sans-serif; font-weight:400; font-size:.9rem; color:var(--soluk); margin-left:.4rem}
.zincir{list-style:none; margin:.6rem 0; padding:0; display:flex; flex-wrap:wrap; gap:.3rem .2rem; font-family:"Alegreya Sans", sans-serif; font-size:.95rem}
.zincir li{background:var(--bg); border:1px solid var(--cizgi); border-radius:1rem; padding:.15rem .6rem}
.zincir li+li::before{content:"→"; color:var(--sikke); margin:0 .35rem 0 -.1rem}
.ara-kutu{display:block; margin:1.5rem 0 1rem; font-family:"Alegreya Sans", sans-serif}
.ara-kutu span{display:block; font-size:.9rem; color:var(--soluk); margin-bottom:.3rem}
.ara-kutu input{width:100%; font:inherit; font-size:1rem; padding:.65rem .8rem; border-radius:.6rem; border:1px solid var(--cizgi); background:var(--yuzey); color:var(--metin)}
.ara-kutu input:focus{outline:2px solid var(--sikke); outline-offset:1px}
.harf{font-family:"Alegreya", Georgia, serif; font-size:1.5rem; color:var(--sikke); margin:1.8rem 0 .4rem; border-bottom:1px solid var(--cizgi); padding-bottom:.2rem}
.sozluk dl{margin:0}
.terim{padding:.55rem 0; border-bottom:1px dashed var(--cizgi)}
.terim dt{font-family:"Alegreya Sans", sans-serif; font-weight:700; font-size:1.02rem}
.terim dd{margin:.2rem 0 0; font-size:1.02rem; line-height:1.55}
.terim-link{text-decoration:none; color:var(--sikke); font-weight:700; margin-left:.2rem}
details.sss{border-bottom:1px solid var(--cizgi)}
details.sss summary{cursor:pointer; list-style:none; padding:.9rem 2rem .9rem 0; position:relative; font-family:"Alegreya Sans", sans-serif; font-weight:700; font-size:1.05rem; line-height:1.35}
details.sss summary::-webkit-details-marker{display:none}
details.sss summary::after{content:"+"; position:absolute; right:.2rem; top:.75rem; font-size:1.3rem; color:var(--sikke); transition:transform .2s}
details.sss[open] summary::after{transform:rotate(45deg)}
.sss-cevap{padding:0 0 1rem}
.sss-cevap p{margin:.2rem 0 .6rem}
.sss-kontrol{display:flex; gap:.5rem; margin:1rem 0 .5rem}
.sss-kontrol button{font:inherit; font-family:"Alegreya Sans", sans-serif; font-size:.9rem; padding:.4rem .8rem; border-radius:1rem; border:1px solid var(--cizgi); background:var(--yuzey); color:var(--metin); cursor:pointer}
@media (prefers-reduced-motion: reduce){ details.sss summary::after{transition:none} }
footer{color:var(--soluk); font-size:.9rem; padding:2rem 0 2.5rem; border-top:1px solid var(--cizgi); margin-top:2rem}
[hidden]{display:none !important}

.bolum summary{list-style:none}
.bolum summary::-webkit-details-marker{display:none}
.bolum .alt{display:block}
.bolum .alt ul{padding-top:.2rem}
.sayfa-nav{display:flex; justify-content:space-between; gap:1rem; margin-top:2.5rem; padding-top:1rem; border-top:1px solid var(--cizgi); font-family:"Alegreya Sans", sans-serif}
.sayfa-nav a{text-decoration:none; max-width:48%}
.sayfa-nav span{display:block; font-size:.85rem; color:var(--soluk)}
.sayfa-nav b{font-family:"Alegreya", Georgia, serif; font-weight:500; font-size:1.1rem}
.sayfa-nav .sonra{text-align:right; margin-left:auto}
.yol a{color:inherit}