/* ══ EV-Buddy REHBER v3 · 2026-09-28 ══ ÜRETİLMİŞ DOSYA: tools/rehber-v2.py
   Kaynak: tools/rehber-kaynak.html (Kemal onaylı tasarım). Elle düzenleme — betik ezer. */
:root{
  --ground:#F3F5FA; --surface:#FFFFFF; --sunken:#E8ECF6;
  --ink:#141B2E; --ink-2:#3F4A63; --ink-3:#6B778F;
  --line:#E0E4F0; --line-2:#CCD3E4;
  --mor:#8B3FD9; --mor-parlak:#A855F7; --mor-zemin:#F4ECFD;
  --iyi:#0FA968; --iyi-zemin:#E3F6EE;
  --dikkat:#B45309; --dikkat-zemin:#FEF3E2;
  --tehlike:#C8322B; --tehlike-zemin:#FDECEA;
  --soguk:#2F6FD6; --soguk-zemin:#E6EFFC;
  --panel:#0A0F1E; --panel-2:#141C33; --panel-ink:#F0F2F8; --panel-ink-2:#9AA5C0;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --ground:#0A0F1E; --surface:#131A30; --sunken:#0D1326;
    --ink:#F0F2F8; --ink-2:#C3CBE0; --ink-3:#9AA5C0;
    --line:#242C46; --line-2:#333D5C;
    --mor:#C084FC; --mor-parlak:#C9A0FF; --mor-zemin:#1E1638;
    --iyi:#2BD68C; --iyi-zemin:#0F2A20;
    --dikkat:#FBBF24; --dikkat-zemin:#2A2112;
    --tehlike:#FF7A70; --tehlike-zemin:#2E1515;
    --soguk:#7EB0FF; --soguk-zemin:#122039;
    --panel:#050A15; --panel-2:#111A31;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --ground:#0A0F1E; --surface:#131A30; --sunken:#0D1326;
  --ink:#F0F2F8; --ink-2:#C3CBE0; --ink-3:#9AA5C0;
  --line:#242C46; --line-2:#333D5C;
  --mor:#C084FC; --mor-parlak:#C9A0FF; --mor-zemin:#1E1638;
  --iyi:#2BD68C; --iyi-zemin:#0F2A20;
  --dikkat:#FBBF24; --dikkat-zemin:#2A2112;
  --tehlike:#FF7A70; --tehlike-zemin:#2E1515;
  --soguk:#7EB0FF; --soguk-zemin:#122039;
  --panel:#050A15; --panel-2:#111A31;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--mor)}
a:focus-visible{outline:2px solid var(--mor);outline-offset:2px;border-radius:4px}
.wrap{max-width:900px;margin:0 auto;padding-inline:18px}
.okuma{max-width:68ch}
b,strong{color:var(--ink)}
p{margin:0 0 12px;color:var(--ink-2)}

/* ── Kapak ── */
.kapak{background:var(--panel);color:var(--panel-ink);padding-block:40px 34px;position:relative;overflow:hidden}
.kapak .wrap{display:grid;grid-template-columns:1.15fr .85fr;gap:28px;align-items:center}
.kapak .ust{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mor-parlak);margin:0 0 12px}
.kapak h1{font-size:clamp(30px,5.6vw,48px);line-height:1.08;letter-spacing:-.03em;margin:0 0 14px;font-weight:850;text-wrap:balance}
.kapak h1 span{color:var(--mor-parlak)}
.kapak p{color:var(--panel-ink-2);margin:0;max-width:46ch}
.egri{background:var(--panel-2);border:1px solid #232C48;border-radius:16px;padding:14px 14px 10px}
.egri svg{display:block;width:100%;height:auto}
.egri small{display:block;font-family:var(--mono);font-size:11px;color:var(--panel-ink-2);margin-top:4px}
@media (max-width:700px){.kapak .wrap{grid-template-columns:1fr}}

/* ── Konu seçici ── */
.secici{position:sticky;top:env(safe-area-inset-top,0px);z-index:10;background:color-mix(in srgb,var(--ground) 92%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.secici ol{list-style:none;margin:0 auto;max-width:900px;padding:10px 18px;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none}
.secici ol::-webkit-scrollbar{display:none}
.secici a{display:flex;align-items:center;gap:7px;white-space:nowrap;text-decoration:none;font-size:14px;font-weight:650;color:var(--ink-2);border:1px solid var(--line-2);background:var(--surface);border-radius:99px;padding:6px 13px 6px 7px}
.secici a i{font-style:normal;font-family:var(--mono);font-size:11.5px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--sunken);color:var(--ink-3)}
.secici a.aktif{border-color:var(--mor);color:var(--mor)}
.secici a.aktif i{background:var(--mor);color:#fff}

/* ── Konu kartları (içindekiler) ── */
.harita{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;margin:30px 0 8px}
.harita a{display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;text-decoration:none;background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:14px;color:var(--ink);transition:border-color .15s,transform .15s}
.harita a:hover{border-color:var(--mor);transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.harita a{transition:none}.harita a:hover{transform:none}}
.harita .ik{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;background:var(--mor-zemin);color:var(--mor)}
.harita b{display:block;font-size:15.5px;line-height:1.3}
.harita span{display:block;font-size:13.5px;color:var(--ink-3);line-height:1.4;margin-top:3px}
.ik svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ── Bölüm ── */
.konu{padding-block:46px 10px;scroll-margin-top:56px}
.konu+.konu{border-top:1px solid var(--line)}
.konu-bas{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin-bottom:18px}
.no{font-family:var(--mono);font-size:54px;line-height:1;font-weight:700;color:transparent;-webkit-text-stroke:1.5px var(--mor);letter-spacing:-.04em}
.konu-bas small{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mor)}
.konu h2{font-size:clamp(24px,4.2vw,33px);line-height:1.15;letter-spacing:-.025em;margin:2px 0 0;font-weight:820;text-wrap:balance}
.giris{font-size:18.5px;color:var(--ink);max-width:62ch;margin:0 0 22px}
.konu h3{font-size:19.5px;line-height:1.3;margin:32px 0 10px;font-weight:750;text-wrap:balance}
.konu h3 em{font-style:normal;font-family:var(--mono);font-size:13px;color:var(--ink-3);font-weight:600;margin-right:8px}

/* ikili kart */
.ikili{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:10px 0 16px}
@media (max-width:640px){.ikili{grid-template-columns:1fr}}
.kart{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.kart h4{margin:0 0 6px;font-size:16.5px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kart p{font-size:15.5px;margin:0}
.etiket{font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border-radius:6px;padding:2px 7px;background:var(--sunken);color:var(--ink-3)}
.etiket.mor{background:var(--mor-zemin);color:var(--mor)}
.etiket.yesil{background:var(--iyi-zemin);color:var(--iyi)}
.etiket.mavi{background:var(--soguk-zemin);color:var(--soguk)}

/* akış şeması */
.akis{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0 2px;font-family:var(--mono);font-size:12px}
.akis span{border:1px solid var(--line-2);border-radius:8px;padding:4px 8px;color:var(--ink-2);background:var(--ground)}
.akis span.vurgu{border-color:var(--mor);color:var(--mor);background:var(--mor-zemin)}
.akis i{font-style:normal;color:var(--ink-3)}

/* tablo */
.tablo{overflow-x:auto;margin:10px 0 18px;border:1px solid var(--line);border-radius:12px}
table{border-collapse:collapse;width:100%;font-size:15px;background:var(--surface)}
th,td{text-align:left;padding:10px 12px;border-bottom:1px solid var(--line);vertical-align:top}
thead th{background:var(--panel);color:var(--panel-ink);font-size:13px;font-weight:700;letter-spacing:.02em}
tbody th{font-weight:650;color:var(--ink);font-size:14.5px}
td{color:var(--ink-2)}
tr:last-child th,tr:last-child td{border-bottom:0}

/* formül */
.formul{background:var(--panel);color:var(--panel-ink);border-radius:14px;padding:18px 20px;margin:12px 0 18px}
.formul .bas{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mor-parlak);margin-bottom:8px}
.formul .ana{font-family:var(--mono);font-size:clamp(14.5px,2.4vw,17px);line-height:1.5;color:#fff}
.formul .ana b{color:var(--mor-parlak)}
.formul ul{margin:10px 0 0;padding-left:18px;color:var(--panel-ink-2);font-size:14.5px}
.formul ul b{color:var(--panel-ink)}

/* örnek fişi */
.fis{background:var(--surface);border:1px dashed var(--line-2);border-radius:14px;padding:16px 18px}
.fis h4{margin:0 0 8px;font-size:15.5px}
.fis dl{display:grid;grid-template-columns:1fr auto;gap:4px 12px;margin:0;font-size:14.5px}
.fis dt{color:var(--ink-3)}
.fis dd{margin:0;font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink);text-align:right}
.fis .sonuc{border-top:1px solid var(--line);margin-top:6px;padding-top:6px;font-weight:700}
.fis .sonuc dd{color:var(--mor)}
.fis p{font-size:13.5px;margin:8px 0 0;color:var(--ink-3)}

/* adımlar */
.adimlar{list-style:none;margin:12px 0 16px;padding:0;counter-reset:a;display:grid;gap:10px}
.adimlar li{counter-increment:a;display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:12px 14px;color:var(--ink-2);font-size:15.5px}
.adimlar li::before{content:counter(a);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--mor);color:#fff;font-weight:800;font-family:var(--mono)}
.adimlar li b{display:block;color:var(--ink);margin-bottom:1px}

/* kural ızgarası */
.kurallar{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px;margin:12px 0 16px;padding:0;list-style:none;counter-reset:k}
.kurallar li{counter-increment:k;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-size:15px;color:var(--ink-2)}
.kurallar li::before{content:counter(k,decimal-leading-zero);display:block;font-family:var(--mono);font-size:12px;font-weight:700;color:var(--mor);margin-bottom:4px}
.kurallar li b{display:block;font-size:15.5px;margin-bottom:3px}
.kurallar.soguk li::before{color:var(--soguk)}

/* kutular */
.not{border-radius:12px;padding:14px 16px;margin:14px 0;font-size:15.5px}
.not p{margin:0;color:var(--ink)}
.not.dikkat{background:var(--dikkat-zemin);border:1px solid color-mix(in srgb,var(--dikkat) 35%,transparent)}
.not.tehlike{background:var(--tehlike-zemin);border:1px solid color-mix(in srgb,var(--tehlike) 40%,transparent)}
.not.tehlike .bas{color:var(--tehlike)}
.not.dikkat .bas{color:var(--dikkat)}
.not .bas{display:block;font-family:var(--mono);font-size:11.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:4px}

/* çubuk grafik */
.cubuklar{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px 18px 12px;margin:12px 0 18px}
.cubuklar .bas{font-size:14px;font-weight:700;color:var(--ink);margin-bottom:12px}
.cubuk{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:12px;align-items:center;margin-bottom:12px}
.cubuk .ad{font-size:13.5px;color:var(--ink-2);line-height:1.3}
.cubuk .ad small{display:block;color:var(--ink-3);font-size:12px}
.ray{position:relative;height:26px;background:var(--sunken);border-radius:7px}
.dolu{position:absolute;inset:0 auto 0 0;border-radius:7px;background:var(--mor);display:flex;align-items:center;justify-content:flex-end;padding-right:8px;font-family:var(--mono);font-size:12.5px;font-weight:700;color:#fff;font-variant-numeric:tabular-nums;white-space:nowrap}
.dolu.mavi{background:var(--soguk)}
.dolu.yesil{background:var(--iyi)}
.dolu.turuncu{background:var(--dikkat)}
.aralik{position:absolute;top:-4px;bottom:-4px;border:2px solid var(--ink);border-radius:5px;opacity:.55}
.olcek{display:grid;grid-template-columns:minmax(120px,190px) 1fr;gap:12px;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.olcek div{display:flex;justify-content:space-between}
.cubuklar .dip{font-size:12.5px;color:var(--ink-3);margin:6px 0 0}
@media (max-width:520px){.cubuk,.olcek{grid-template-columns:1fr;gap:4px}.olcek>span{display:none}}

/* SOH ölçeği */
.soh{margin:14px 0 18px}
.soh-ray{display:grid;grid-template-columns:70fr 15fr 15fr;height:42px;border-radius:10px;overflow:hidden;font-family:var(--mono);font-size:12.5px;font-weight:700;color:#fff}
.soh-ray div{display:grid;place-items:center;padding-inline:4px;text-align:center;line-height:1.1}
.soh-ray .r{background:var(--tehlike)}
.soh-ray .o{background:var(--dikkat)}
.soh-ray .g{background:var(--iyi)}
.soh-cizgi{display:grid;grid-template-columns:70fr 15fr 15fr;font-family:var(--mono);font-size:11px;color:var(--ink-3);margin-top:4px}
.soh-cizgi span:nth-child(2),.soh-cizgi span:nth-child(3){border-left:1px solid var(--line-2);padding-left:4px}
.soh-aciklama{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
@media (max-width:640px){.soh-aciklama{grid-template-columns:1fr}}
.soh-aciklama div{border-radius:12px;padding:12px 14px;font-size:14.5px;color:var(--ink-2);border:1px solid var(--line)}
.soh-aciklama b{display:block;font-family:var(--mono);font-size:13px}
.soh-aciklama .r b{color:var(--tehlike)}
.soh-aciklama .o b{color:var(--dikkat)}
.soh-aciklama .g b{color:var(--iyi)}

/* batarya göstergesi */
.gosterge{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:18px;margin:12px 0 18px}
.pil{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;padding:6px;border:2px solid var(--ink-3);border-radius:10px;position:relative;margin-right:10px}
.pil::after{content:"";position:absolute;right:-10px;top:30%;height:40%;width:6px;border-radius:0 3px 3px 0;background:var(--ink-3)}
.pil div{height:34px;border-radius:4px;background:var(--sunken)}
.pil .g{background:var(--iyi)}
.pil .y{background:color-mix(in srgb,var(--dikkat) 55%,var(--sunken))}
.pil-alt{display:grid;grid-template-columns:repeat(10,1fr);gap:4px;padding-inline:8px;margin:6px 10px 0 0;font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.pil-alt span{text-align:left}
.gosterge .ac{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:14px;color:var(--ink-2)}
.gosterge .ac i{display:inline-block;width:12px;height:12px;border-radius:3px;vertical-align:-1px;margin-right:6px}

/* kontrol listesi */
.kontrol{list-style:none;margin:12px 0 16px;padding:0;border:1px solid var(--line);border-radius:14px;background:var(--surface);overflow:hidden}
.kontrol li{display:grid;grid-template-columns:26px minmax(0,1fr);gap:12px;padding:12px 16px;border-bottom:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.kontrol li:last-child{border-bottom:0}
.kontrol li::before{content:"";width:22px;height:22px;border:2px solid var(--iyi);border-radius:6px;margin-top:2px;background:linear-gradient(135deg,transparent 45%,var(--iyi) 45%,var(--iyi) 55%,transparent 55%) no-repeat;background-size:0 0}
.kontrol li b{display:block;color:var(--ink)}

/* etken listesi */
.etkenler{list-style:none;margin:12px 0 16px;padding:0;display:grid;gap:8px}
.etkenler li{display:grid;grid-template-columns:40px 1fr;gap:12px;align-items:start;font-size:15.5px;color:var(--ink-2)}
.etkenler li .ik{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:var(--mor-zemin);color:var(--mor)}
.etkenler li .ik svg{width:21px;height:21px}
.etkenler li b{display:block;color:var(--ink)}

/* kaynak */
.kaynak{margin:26px 0 0;padding-top:12px;border-top:1px dashed var(--line-2);font-size:12.5px;line-height:1.55;color:var(--ink-3)}
.kaynak b{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3);margin-right:6px}
.kaynak a{color:var(--ink-3)}
.kaynak ul{margin:4px 0 0;padding-left:16px}

/* son söz + uygulama */
.son{background:var(--panel);color:var(--panel-ink);margin-top:40px;padding-block:34px}
.son .kutu{display:grid;grid-template-columns:1fr auto;gap:18px;align-items:center}
@media (max-width:640px){.son .kutu{grid-template-columns:1fr}}
.son h2{margin:0 0 6px;font-size:22px}
.son p{color:var(--panel-ink-2);margin:0;font-size:15.5px}
.son .dugme{display:inline-block;text-decoration:none;background:var(--mor-parlak);color:#fff;font-weight:750;padding:12px 20px;border-radius:99px;white-space:nowrap}
.yasal{border-top:1px solid #232C48;margin-top:26px;padding-top:16px;font-size:13px;color:var(--panel-ink-2)}
.yasal b{color:var(--panel-ink)}

/* konu çizimleri */
.resim{margin:0 0 22px;border-radius:16px;overflow:hidden;background:var(--panel);border:1px solid #232C48}
.resim svg{display:block;width:100%;height:auto}
.resim .c{fill:none;stroke:#9AA5C0;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.resim .zemin{fill:#141C33}
.resim .serit{stroke:#333D5C;stroke-width:3;stroke-dasharray:18 14}
.resim .govde{fill:#1E2742;stroke:#9AA5C0;stroke-width:2.5;stroke-linejoin:round}
.resim .cam{fill:#0A0F1E;stroke:#9AA5C0;stroke-width:2}
.resim .teker{fill:#0A0F1E;stroke:#C3CBE0;stroke-width:3}
.resim .mor{fill:#A855F7}.resim .mor-c{fill:none;stroke:#A855F7;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.resim .yesil{fill:#2BD68C}.resim .yesil-c{fill:none;stroke:#2BD68C;stroke-width:3;stroke-linecap:round}
.resim .sari{fill:#FBBF24}.resim .kirmizi{fill:#FF7A70}.resim .mavi{fill:#7EB0FF}.resim .mavi-c{fill:none;stroke:#7EB0FF;stroke-width:2.5;stroke-linecap:round}
.resim .soluk{fill:#9AA5C0}.resim text{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;fill:#9AA5C0}
.resim text.b{fill:#F0F2F8;font-weight:700}

/* ── Site çerçevesi (üst çubuk, kırıntı, çağrı, altbilgi) ── */
.ustbar{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--ground) 90%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.ustbar-ic{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-top:11px;padding-bottom:11px}
.ustbar a{text-decoration:none}
.logo{font-weight:800;color:var(--ink);font-size:16px}
.logo span{color:var(--mor)}
.ust-baglar{display:flex;gap:14px;align-items:center;font-size:14.5px}
.ust-baglar a{color:var(--ink-2);font-weight:600}
.ust-baglar .cta{color:var(--mor);border:1px solid var(--line-2);border-radius:99px;padding:6px 14px;white-space:nowrap}
.kirinti{font-size:13.5px;color:var(--ink-3);margin:22px 0 0}
.kirinti a{color:var(--ink-3)}
.tek{padding-top:18px}
.arama-sorusu{font-size:17px;font-weight:650;color:var(--mor);margin:-6px 0 18px;max-width:62ch}
.tek h1{font-size:clamp(26px,4.8vw,38px);line-height:1.12;letter-spacing:-.025em;margin:2px 0 0;font-weight:820;text-wrap:balance}
.cagri{background:var(--panel);color:var(--panel-ink);border-radius:18px;padding:24px 22px;margin:40px 0 10px}
.cagri h2{color:var(--panel-ink);margin:0 0 8px;font-size:23px}
.cagri p{color:var(--panel-ink-2);margin:0 0 4px}
.dugmeler{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.dugme{display:inline-block;background:var(--mor-parlak);color:#fff;font-weight:700;font-size:15.5px;text-decoration:none;border-radius:12px;padding:12px 20px}
.dugme.ikinci{background:transparent;border:1px solid #3a4468;color:var(--panel-ink)}
.diger{margin:34px 0 10px}
.diger h2{font-size:20px;margin:0}
.diger .harita{margin-top:12px}
.yasal-not{font-size:13px;color:var(--ink-3);border-top:1px solid var(--line);margin:30px 0 0;padding-top:14px}
.yasal-not b{color:var(--ink-2)}
footer.site{background:var(--panel);color:var(--panel-ink-2);padding:30px 0;font-size:14px;margin-top:30px}
footer.site b{color:var(--panel-ink)}
footer.site a{color:var(--panel-ink-2)}
footer.site p{margin:8px 0 0;line-height:1.9;color:var(--panel-ink-2)}