:root{
  /* ---------------------------------------------------------------------
     Life Climate marka kiti v1.0 (Eylül 2026)

     Ana Mavi #0278B5 · Koyu Lacivert #001E2D · Yeşil Vurgu #6DBF68
     Açık Gri Zemin #F3F5F5 · Beyaz #FFFFFF

     Kitin iki kuralı burada belirleyici oldu:

     1) "Metin rengi olarak saf siyah yerine #001E2D kullanın."
        --ink bu yüzden lacivert.
     2) "#6DBF68 üzerine beyaz metin koymayın, kontrast yetersiz."
        Ölçtük: 2.26:1. Bu yüzden yeşil yalnızca dolgu ve vurgu olarak
        kullanılıyor; üzerine yazı gelen yerlerde koyulaştırılmış
        --ets (#3F7539, beyazla 5.50:1) devrede.

     Modül ve durum renkleri kitte tanımlı değil; kit ailesinden
     türetilip beyaz metinle WCAG AA'yı geçecek kadar koyulaştırıldı.
     --------------------------------------------------------------------- */
  --rail:#001E2D; --rail-hi:#00344E; --rail-txt:#CCD2D5;
  --rail-mut:#99A5AB; --rail-line:rgba(255,255,255,.14); --leaf:#6DBF68; --sky:#95C8EC;
  --canvas:#F3F5F5; --panel:#FFFFFF; --panel-2:#F8FAFA;
  --ink:#001E2D; --muted:#54666F; --line:#CCD2D5; --line-soft:#E2E6E8;
  --brand:#0278B5; --brand-hi:#025A88; --link:#0099FF; --cyan:#99EEFF;
  --ets:#3F7539; --ets-soft:#E9F3E8;
  --cbam:#0278B5; --cbam-soft:#E3F1F9;
  --cost:#A32A21; --cost-soft:#F8E8E6;
  --income:#2F6B45; --income-soft:#E6F1EA;
  --warn:#8A6208; --warn-soft:#FBF0D8;
  --sans:"Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --head:"Lexend Deca","Instrument Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --mono:"Fragment Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--canvas);color:var(--ink);font-family:var(--sans);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased}
button,input,select,textarea{font-family:inherit;font-size:inherit;color:inherit}
input,select{background:#fff;border:1px solid var(--line);border-radius:3px;padding:6px 8px;width:100%}
input:focus,select:focus,button:focus-visible{outline:2px solid var(--ets);outline-offset:1px}
input[type=number]{font-family:var(--mono);text-align:right;font-variant-numeric:tabular-nums}
label{display:block;font-size:11.5px;color:var(--muted);margin-bottom:3px;font-weight:500}

/* ---------- shell ---------- */
.shell{display:grid;grid-template-columns:236px 1fr;min-height:100vh}
.rail{background:var(--rail);color:var(--rail-txt);padding:0 0 40px;position:sticky;top:0;height:100vh;overflow-y:auto}
.brand{padding:20px 18px 16px;border-bottom:1px solid var(--rail-line)}
.brand b{display:block;color:#fff;font-family:var(--head);font-size:16px;font-weight:700;letter-spacing:.04em}
.logo{display:inline-block;background:#fff;border-radius:4px;padding:8px 11px;margin-bottom:12px;line-height:0}
.logo img{height:26px;width:auto;max-width:176px;display:block}
.brand span{display:block;font-size:11px;color:var(--rail-mut);margin-top:3px}
.navgrp{padding:14px 0 2px}
.navgrp>p{margin:0 0 4px;padding:0 18px;font-size:10.5px;letter-spacing:.06em;color:var(--rail-mut);font-weight:600}
.navbtn{display:flex;gap:9px;align-items:baseline;width:100%;background:none;border:0;text-align:left;padding:7px 18px;color:var(--rail-txt);cursor:pointer;border-left:3px solid transparent;font-size:13px}
.navbtn:hover{background:rgba(255,255,255,.09);color:#fff}
.navbtn.on{background:var(--rail-hi);color:#fff;border-left-color:var(--leaf);font-weight:500}
.navbtn i{font-style:normal;font-family:var(--mono);font-size:10.5px;color:#95C8EC;min-width:14px}
.navbtn.on i{color:var(--leaf)}
.railfoot{margin-top:18px;padding:14px 18px 0;border-top:1px solid var(--rail-line);font-size:11px;color:var(--rail-mut);line-height:1.6}

.main{min-width:0;display:flex;flex-direction:column}
.topbar{background:var(--panel);border-bottom:1px solid var(--line);padding:9px 24px;display:flex;gap:12px;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:20}
.tb{display:flex;gap:7px;align-items:center;font-size:12px;color:var(--muted)}
.tb strong{font-family:var(--mono);color:var(--ink);font-weight:600}
.tb select,.tb input{width:auto;padding:4px 6px;font-size:12px}
.tb input.kol{border-color:var(--brand);color:var(--brand);font-weight:600}
.sablonlar{display:grid;gap:11px;max-height:58vh;overflow-y:auto;padding-right:2px}
.ksliste{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:8px;margin-bottom:6px}
.ksliste label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink);
  border:1px solid var(--line);border-radius:5px;padding:9px 11px;cursor:pointer}
.ksliste label:hover{border-color:var(--brand)}
.ksliste input{width:auto;margin:2px 0 0;flex:none}
.ksliste small{display:block;color:var(--muted);font-size:11px;margin-top:2px}
.sablon{border:1px solid var(--line);border-radius:5px;padding:13px 15px;
 display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center}
.sablon:hover{border-color:var(--brand)}
.sablon h3{margin:0 0 4px;font-size:14px;font-family:var(--head);font-weight:600;color:var(--ink)}
.sablon p{margin:0;font-size:12px;color:var(--muted);line-height:1.55}
.sablon .ogret{margin-top:5px;font-size:11.5px;color:var(--brand);line-height:1.5}
.sablon .kirp{margin-top:5px;font-size:11px;color:var(--cost)}
.sablon .rozet{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:6px}
.sablon .rozet span{font-size:9.5px;letter-spacing:.05em;font-weight:600;text-transform:uppercase;
 padding:2px 7px;border-radius:11px;background:var(--panel-2);color:var(--muted)}
@media(max-width:640px){.sablon{grid-template-columns:1fr}}
.tbspace{flex:1}
.langsw{display:flex;border:1px solid var(--line);border-radius:3px;overflow:hidden}
.langsw button{background:#fff;border:0;padding:4px 10px;cursor:pointer;font-size:12px;font-weight:500;color:var(--muted)}
.langsw button.on{background:var(--brand);color:#fff}
.raillang{padding:14px 18px 0;margin-top:8px}
.raillang .langsw{border-color:var(--rail-line);width:max-content}
.raillang .langsw button{background:transparent;color:var(--rail-mut)}
.raillang .langsw button:hover{background:var(--rail-hi);color:var(--rail-txt)}
.raillang .langsw button.on{background:var(--brand);color:#fff}

/* 1180 piksel, 1500 piksellik bir ekranda sagda 250 piksel bos alan
   birakiyordu; 12 kolonlu CBAM tablosu ise yatay kayiyordu. Genis
   ekranda tablolar yerlesiyor, okunan metinler kendi olculerinde
   (.lede 70ch) kaliyor. */
.view{padding:24px 28px 72px;max-width:1760px;display:none}
.view.on{display:block}
h1{font-family:var(--head);font-size:23px;font-weight:700;letter-spacing:-.02em;margin:0 0 4px;text-wrap:balance}
.lede{color:var(--muted);margin:0 0 22px;max-width:70ch;font-size:13.5px}
h2{font-family:var(--head);font-size:15px;font-weight:600;margin:0 0 2px;letter-spacing:-.01em}
h3{font-family:var(--head);font-size:13px;font-weight:600;margin:18px 0 8px}
.step{display:flex;align-items:baseline;gap:10px;margin:0 0 12px}
.step b{font-family:var(--mono);font-size:11px;color:#fff;background:var(--ets);border-radius:2px;padding:2px 6px;font-weight:600}
.card{background:var(--panel);border:1px solid var(--line);border-radius:5px;padding:18px;margin-bottom:18px}
.card.tight{padding:14px}
.card>h2+p.sub{margin:0 0 14px;color:var(--muted);font-size:12.5px;max-width:104ch}
.grid{display:grid;gap:12px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.g5{grid-template-columns:repeat(5,1fr)}
@media(max-width:900px){.g3,.g4,.g5{grid-template-columns:repeat(2,1fr)}}

/* ---------- tables ---------- */
table{width:100%;border-collapse:collapse;font-size:12.5px}
th{text-align:left;font-weight:600;font-size:11px;color:var(--muted);padding:6px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:5px 8px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
tr:last-child td{border-bottom:0}
.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
tfoot td{border-top:2px solid var(--ink);border-bottom:0;font-weight:600;padding-top:8px}
.tblwrap{overflow-x:auto;margin:0 -4px}
/* Hucre icindeki ikincil giris. Eskiden satir ici bir input idi ve
   genel "input" genisligiyle hucreden 42 piksel tasip komsu
   hucrenin alanina biniyordu. */
.altgiris{display:flex;align-items:center;justify-content:flex-end;gap:5px;margin-top:4px;
  font-size:10px;color:var(--muted)}
.altgiris input{width:66px;min-width:0;padding:2px 5px;font-size:10.5px}
td input,td select{padding:4px 6px;font-size:12px;min-width:66px}
.rowdel{background:none;border:0;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:2px 5px;border-radius:3px}
.rowdel:hover{background:var(--cost-soft);color:var(--cost)}

/* ---------- buttons ---------- */
/* Marka kiti: "Ana mavi #0278B5 buton, vurgu ve interaktif ogeler
   icindir, genis zemin rengi olarak lacivert veya acik gri tercih edin."
   Ana dugme bir sure var(--ink) kullaniyordu; --ink metin rengi (lacivert)
   oldugu icin dugmeler neredeyse siyah goruntu veriyordu. Beyaz metin
   #0278B5 uzerinde 4.82:1 ile AA geciyor (kit de bunu soyluyor). */
.btn{background:var(--brand);color:#fff;border:0;border-radius:3px;padding:8px 14px;cursor:pointer;font-weight:500;font-size:13px}
.btn:hover{background:var(--brand-hi)}
.btn:focus-visible{outline:2px solid var(--brand-hi);outline-offset:2px}
.btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.sec:hover{background:var(--panel-2)}
.btn.ets{background:var(--ets)} .btn.ets:hover{background:#0F6960}
.btn.sm{padding:5px 10px;font-size:12px}
/* Kapali dugme kapali gorunsun. Program boyunca birkac dugme duruma
   gore disabled oluyordu (ek rezerv, temin plani, iceri aktarma) ama
   hicbiri bunu belli etmiyordu: kullanici tiklanabilir sanip
   tikliyor, hicbir sey olmuyordu. */
.btn[disabled],.btn:disabled{opacity:.42;cursor:not-allowed}
.btn[disabled]:hover,.btn:disabled:hover{background:var(--brand)}
.btn.sec[disabled]:hover,.btn.sec:disabled:hover{background:#fff}
.btn.ets[disabled]:hover,.btn.ets:disabled:hover{background:var(--ets)}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}

/* ---------- figures ---------- */
.figs{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:5px;overflow:hidden}
.fig{background:var(--panel);padding:13px 15px}
.fig span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}
.fig b{display:block;font-family:var(--mono);font-size:19px;font-weight:600;letter-spacing:-.02em}
.fig b .birim{font-family:var(--sans,inherit);font-style:normal;font-size:11.5px;font-weight:500;letter-spacing:0;opacity:.75;white-space:nowrap}
.fig small{display:block;font-size:10.5px;color:var(--muted);margin-top:3px;font-family:var(--sans)}
/* .fig span{display:block} bir ust satirdaki kural, icteki <span
   class="pill"> ogesini de yakalayip blok yapiyordu: rozet kutunun
   tamamina yayiliyordu. Ozgulluk 0,1,1'e karsi 0,1,0 oldugu icin .pill
   kaybediyor. Bu yuzden acikca geri aliniyor. */
.fig small .pill,.fig small .mono{display:inline-block;width:auto}
.fig small .mono{font-family:var(--mono);color:var(--ink)}
.fig.cost b{color:var(--cost)} .fig.income b{color:var(--income)}
.fig.cbam b{color:var(--cbam)} .fig.ets b{color:var(--ets)}

.headline{background:var(--rail);color:#fff;border-radius:5px;padding:22px 24px;margin-bottom:18px;display:grid;grid-template-columns:minmax(240px,340px) 1fr;gap:26px;align-items:center}
@media(max-width:820px){.headline{grid-template-columns:1fr}}
.headline .k{font-size:11.5px;color:var(--sky);margin:0 0 6px}
.headline .v{font-family:var(--mono);font-size:36px;font-weight:600;letter-spacing:-.03em;line-height:1.05;margin:0}
.headline .n{font-size:11.5px;color:var(--sky);margin:8px 0 0;line-height:1.5}

.pill{display:inline-block!important;padding:2px 8px;border-radius:11px;font-size:11px;font-weight:600;white-space:nowrap;width:auto}
.pill.in{background:var(--income-soft);color:var(--income)}
.pill.out{background:#EAEDEB;color:var(--muted)}
.pill.a{background:var(--income-soft);color:var(--income)}
/* --cbam (#0278B5) acik mavi zeminde 10-11 pikselde 4,18 kaliyordu. */
.pill.b{background:var(--cbam-soft);color:#015F8F}
.pill.c{background:var(--rail);color:#fff}
.pill.warn{background:var(--warn-soft);color:var(--warn)}
.pill.cost{background:var(--cost-soft);color:var(--cost)}

/* Kaynak rozeti: sayının yanında, sayıyı bastırmadan. 9,5 piksel
   küçük metin sayıldığı için renkler AA eşiğinin üstünde tutuldu. */
.rozet{display:inline-block;font-size:9.5px;line-height:1;padding:3px 6px;border-radius:9px;
  white-space:nowrap;vertical-align:middle;border:1px solid transparent;font-weight:500}
.rozet.r-resmi{background:var(--cbam-soft);color:#025A88;border-color:#B6D8EC}
.rozet.r-gosterge{background:var(--warn-soft);color:#6A4B06;border-color:#E2CF9E}
.rozet.r-varsayim{background:var(--panel-2);color:var(--muted);border-color:var(--line)}
.rozet.r-kullanici{background:var(--ets-soft);color:#2E5A29;border-color:#BCD7B9}
/* Kapsam sorgusundaki aday kodlar. */
.kapsamadaylar{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.kapsamaday{display:inline-flex;flex-direction:column;align-items:flex-start;gap:1px;text-align:left;
  font-size:12px;padding:5px 9px;border:1px solid var(--line);border-radius:4px;background:var(--panel);
  color:var(--ink);cursor:pointer;max-width:260px;font-family:var(--sans)}
.kapsamaday .mono{font-family:var(--mono);font-size:12px}
.kapsamaday small{font-size:10.5px;color:var(--muted);line-height:1.3}
button.kapsamaday:hover{border-color:var(--brand);background:var(--cbam-soft)}
button.kapsamaday:focus-visible{outline:2px solid var(--brand-hi);outline-offset:1px}
.kapsamaday.haric{cursor:default;background:var(--panel-2);border-style:dashed}
.rozetaciklama{display:flex;gap:14px;flex-wrap:wrap;align-items:center;margin-top:10px;
  font-size:11px;color:var(--muted)}
.rozetaciklama span{display:flex;gap:5px;align-items:center}
.note{border-left:3px solid var(--line);padding:9px 0 9px 12px;color:var(--muted);font-size:12px;margin:12px 0;max-width:104ch}
.note.warn{border-left-color:var(--warn);background:var(--warn-soft);padding:9px 12px;color:#6A4B06;border-radius:0 3px 3px 0}
.note.info{border-left-color:var(--cbam);background:var(--cbam-soft);padding:9px 12px;color:#025A88;border-radius:0 3px 3px 0}
.chk{display:flex;gap:7px;align-items:flex-start;font-size:12.5px;color:var(--ink);margin:4px 0}
.chk input{width:auto;margin-top:2px}
.formula{font-family:var(--mono);font-size:12.5px;background:var(--panel-2);border:1px solid var(--line-soft);border-radius:3px;padding:9px 11px;margin:8px 0;overflow-x:auto;white-space:nowrap}
.src{font-size:11px;color:var(--muted);margin-top:10px;line-height:1.6;max-width:110ch}
.src a{color:var(--cbam)}
.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}
.hidden{display:none!important}
.result{border:1px solid var(--line);border-radius:4px;padding:14px;background:var(--panel-2);margin-top:12px}
svg.chart{display:block;width:100%;height:auto;overflow:visible}
svg text{font-family:var(--sans);fill:var(--muted);font-size:10.5px}
svg text.val{font-family:var(--mono);fill:var(--ink);font-size:10.5px;font-weight:600}
/* Koyu zemine cizilen grafik yazilari. SVG'de fill="..." bir SUNUM
   OZNITELIGI ve yukaridaki "svg text" kuralina her zaman yeniliyor:
   lacivert seridin uzerindeki butun etiketler --muted ile, yani
   2,87 kontrastla ciziliyordu. Rol basina sinif veriyoruz. */
svg text.acik{fill:var(--sky)}
svg text.beyaz{fill:#fff}
svg text.koyu{fill:#001E2D}
svg text.gelir{fill:#8ACC86}
.legend{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--muted);margin-top:10px}
.legend i{display:inline-block;width:9px;height:9px;border-radius:2px;margin-right:5px}
.empty{padding:26px;text-align:center;color:var(--muted);font-size:12.5px;border:1px dashed var(--line);border-radius:4px}
@media(max-width:760px){
  .shell{grid-template-columns:1fr}
  .rail{position:static;height:auto}
  .view{padding:16px 14px 60px}
}
/* ---------- kayıt / giriş ekranı ---------- */
body.locked .shell{display:none}
/* Giris ekraninin zemini. Bir sure var(--rail) kullandi; --rail marka
   kitiyle lacivert #001E2D olunca ekran neredeyse siyaha dondu ve
   kartin arkasi agirlastı. Artik tanitim sayfasindaki kahraman bandiyla
   AYNI gradyan: laciverten ana maviye. Ziyaretci tanitim sayfasindan
   gelirken renk sureklilgi bozulmuyor. */
.gate{position:fixed;inset:0;z-index:200;background:linear-gradient(135deg,#001E2D 0%,#014A6F 55%,#0278B5 100%);display:flex;align-items:center;justify-content:center;padding:22px;overflow-y:auto}
body:not(.locked) .gate{display:none}
.gatecard{width:100%;max-width:900px;background:var(--panel);border-radius:10px;overflow:hidden;display:grid;grid-template-columns:1.02fr 1fr;box-shadow:0 24px 60px rgba(0,30,45,.42)}
/* Kartin sol paneli DUZ lacivert: dis zemin gradyanli oldugu icin panel
   de gradyanli olsa kartin keskin kenari kaybolur, kart zeminin icinde
   erir. Duz renk kartin bir kart oldugunu belli ediyor. */
.gateside{background:var(--rail);color:#fff;padding:32px 30px;display:flex;flex-direction:column}
.gateside h1{font-family:var(--head);font-size:21px;font-weight:700;margin:20px 0 8px;letter-spacing:-.02em;line-height:1.25}
.gateside p{font-size:13px;color:var(--sky);margin:0 0 20px;line-height:1.6}
.gateside ul{list-style:none;margin:0;padding:0;font-size:12.5px;color:#DCE4E7}
.gateside li{padding:7px 0 7px 20px;position:relative;line-height:1.5}
.gateside li::before{content:"";position:absolute;left:0;top:14px;width:8px;height:8px;border-radius:2px;background:var(--leaf)}
.gatefoot{margin-top:auto;padding-top:22px;font-size:11px;color:#99A5AB;line-height:1.6;border-top:1px solid rgba(255,255,255,.18)}
.gatefoot .gatelegal{display:block;margin-top:7px}
.gatefoot .gatelegal a{color:var(--cyan);text-decoration:none;margin-right:12px}
.gatefoot .gatelegal a:hover{color:#fff;text-decoration:underline}
.gateform{padding:30px 30px 32px;display:flex;flex-direction:column}
.gtabs{display:flex;border-bottom:1px solid var(--line);margin-bottom:19px}
.gtabs button{flex:1;background:none;border:0;border-bottom:2px solid transparent;padding:9px 4px;cursor:pointer;font-size:13.5px;font-weight:500;color:var(--muted)}
.gtabs button.on{color:var(--ink);border-bottom-color:var(--brand)}
.gfields{display:grid;gap:11px}
.gfields.two{grid-template-columns:1fr 1fr}
.ghint{font-size:11px;color:var(--muted);margin-top:4px;line-height:1.45}
.gmsg{margin-top:14px;font-size:12.5px;padding:9px 11px;border-radius:3px;display:none}
.gmsg.err{display:block;background:var(--cost-soft);color:var(--cost);border-left:3px solid var(--cost)}
.gmsg.ok{display:block;background:var(--income-soft);color:var(--income);border-left:3px solid var(--income)}
.gswitch{margin-top:15px;font-size:12.5px;color:var(--muted)}
.gswitch button{background:none;border:0;color:var(--brand);cursor:pointer;font-weight:600;padding:0;font-size:12.5px;text-decoration:underline}
.userchip{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);border-left:1px solid var(--line);padding-left:14px}
.userchip .ad{min-width:0;max-width:120px}
.userchip .ad span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.userchip b{color:var(--ink);font-weight:600}
.userchip button{background:none;border:1px solid var(--line);border-radius:3px;padding:3px 9px;cursor:pointer;font-size:11.5px;color:var(--muted)}
.userchip button:hover{background:var(--panel-2);color:var(--ink)}
.gchk{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;color:var(--ink);line-height:1.5;margin-top:2px}
.gchk input{width:auto;margin-top:2px;flex:none}
.codein{font-family:var(--mono);font-size:26px;letter-spacing:.42em;text-align:center;padding:12px 8px;font-weight:600}
.gback{background:none;border:0;color:var(--muted);cursor:pointer;font-size:12.5px;padding:0;text-decoration:underline}
/* şifre göster/gizle */
.pwwrap{position:relative;display:block}
.pwwrap input{padding-right:38px !important}
.pweye{position:absolute;top:50%;right:6px;transform:translateY(-50%);width:28px;height:28px;display:grid;place-items:center;background:none;border:0;padding:0;cursor:pointer;border-radius:6px;color:var(--muted);line-height:0}
.pweye:hover{color:var(--ink);background:rgba(0,0,0,.05)}
.pweye:focus-visible{outline:2px solid var(--brand);outline-offset:1px}
.pweye svg{width:17px;height:17px;display:block;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.modal{position:fixed;inset:0;background:rgba(6,34,50,.6);display:flex;align-items:center;justify-content:center;z-index:300;padding:20px;overflow-y:auto}
.modal.hidden{display:none}
.modalbox{background:var(--panel);border-radius:6px;max-width:520px;width:100%;padding:24px 24px 22px;box-shadow:0 20px 48px rgba(6,40,60,.34)}
.modalbox h2{margin:0 0 4px}
.stepnav{border-top:1px solid var(--line);margin-top:26px;padding-top:16px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.stepnav .txt{flex:1;min-width:220px;font-size:12.5px;color:var(--muted);line-height:1.55}
.stepnav .txt b{color:var(--ink)}
.prog{display:flex;gap:4px;margin:0 0 18px;flex-wrap:wrap}
.prog span{flex:1;min-width:26px;height:5px;border-radius:3px;background:var(--line)}
.prog span.on{background:var(--leaf)}
.prog span.cur{background:var(--brand)}
.progtxt{font-size:11.5px;color:var(--muted);margin:-12px 0 18px}
.cta{background:linear-gradient(158deg,#025A88,#001E2D);color:#fff;border-radius:6px;padding:20px 22px;margin-bottom:18px}
.cta h2{color:#fff;font-size:16px;margin:0 0 6px}
.cta p{margin:0 0 14px;font-size:13px;color:#DCEAF4;line-height:1.6;max-width:70ch}
.cta a.btn{background:#fff;color:#025A88;text-decoration:none;display:inline-block;font-weight:600}
.cta a.btn:hover{background:#E7F2F9}
.gatecta{margin-top:18px;padding:14px;background:rgba(255,255,255,.12);border-radius:5px}
.gatecta b{display:block;font-size:13px;margin-bottom:5px}
.gatecta p{font-size:12px;color:#DCEAF4;margin:0 0 10px;line-height:1.55}
.gatecta a{display:inline-block;background:#fff;color:#025A88;text-decoration:none;padding:7px 13px;border-radius:3px;font-size:12.5px;font-weight:600}
a.btn{text-decoration:none;display:inline-block}
.pending{font-family:var(--mono);font-size:12.5px;background:var(--panel-2);border:1px dashed var(--line);border-radius:3px;padding:10px 12px;margin-top:12px;text-align:center}
@media(max-width:780px){.gatecard{grid-template-columns:1fr}.gateside{padding:24px 22px}.gateside ul{display:none}.gfields.two{grid-template-columns:1fr}}
#printArea{display:none}
@media print{
 body>*{display:none!important}
 body>#printArea{display:block!important}
 @page{size:A4;margin:14mm 13mm}
}
#printArea .pa{font-family:var(--sans);color:#001E2D;font-size:10.5pt;line-height:1.5}
#printArea .ph{display:flex;align-items:center;gap:16px;border-bottom:2.5pt solid #0278B5;padding-bottom:10px;margin-bottom:16px}
#printArea .ph img{height:30px}
#printArea .ph .t1{font-size:17pt;font-weight:600;letter-spacing:-.3pt;color:#004467}
#printArea .ph .t2{font-size:10pt;color:#54666F;margin-top:2px}
#printArea .ph .meta{margin-left:auto;text-align:right;font-size:8.5pt;color:#54666F;font-family:var(--mono)}
#printArea .hero{background:#F3F5F5;border-left:3.5pt solid #6DBF68;padding:12px 16px;margin-bottom:16px}
#printArea .hl{font-size:9pt;color:#54666F}
#printArea .hv{font-family:var(--mono);font-size:24pt;font-weight:600;letter-spacing:-.6pt;color:#004467;line-height:1.1}
#printArea .hs{font-size:9pt;color:#54666F;margin-top:3px}
#printArea section{margin-bottom:15px;break-inside:avoid}
#printArea h2{font-size:11pt;font-weight:600;color:#004467;margin:0 0 7px;padding-bottom:3px;border-bottom:.6pt solid #CCD2D5}
#printArea ul{margin:0;padding-left:16px}
#printArea li{margin-bottom:5px;font-size:9.8pt;line-height:1.5}
#printArea .two{display:flex;gap:20px}
#printArea .two>div{flex:1}
#printArea table{width:100%;border-collapse:collapse;font-size:9pt}
#printArea .kv td{padding:3px 0;border-bottom:.4pt solid #E2E6E8;vertical-align:top}
#printArea .kv td.k{color:#54666F;width:56%}
#printArea .kv td.v{text-align:right;font-family:var(--mono)}
#printArea .pt th{background:#F3F5F5;text-align:left;padding:5px 6px;font-size:8.2pt;color:#004467;border-bottom:.6pt solid #CCD2D5}
#printArea .pt td{padding:4px 6px;border-bottom:.4pt solid #E2E6E8}
#printArea .pt td.n{text-align:right;font-family:var(--mono)}
#printArea .pt td.b{font-weight:600}
#printArea .pt tfoot td{border-top:1pt solid #001E2D;font-weight:600;padding-top:5px}
#printArea .fx{font-family:var(--mono);font-size:9pt;background:#F4F8FB;padding:9px 11px;line-height:1.8}
#printArea .dis{font-size:8.2pt;color:#54666F;line-height:1.5;margin:9px 0 0}
#printArea .pf{border-top:.6pt solid #CCD2D5;margin-top:16px;padding-top:8px;display:flex;justify-content:space-between;font-size:8.2pt;color:#54666F}

/* =====================================================================
   Kompakt ana ekran

   Eskiden başlık, alt başlık, ilerleme çubuğu, net maliyet bandı ve dört
   rakam kutusu üst üste beş ayrı blok halinde diziliyordu; ekranın ilk
   görünen kısmı yalnızca bunlarla doluyordu. Şimdi başlık ile ilerleme
   yan yana, net maliyet ile rakamlar tek bir bandın içinde.
   ===================================================================== */
.dashtop{display:flex;gap:24px;align-items:flex-start;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap}
.dashtitle{flex:1;min-width:280px}
.dashtitle h1{margin-bottom:3px}
.lede.tight{margin:0;font-size:12.5px;max-width:66ch;line-height:1.55}
.dashprog{width:260px;flex:none;padding-top:4px}
.dashprog .prog{margin:0 0 6px}
.dashprog .prog span{min-width:0;height:4px}
.dashprog .progtxt{margin:0;font-size:11px}
@media(max-width:900px){.dashprog{width:100%;padding-top:2px}}

/* Yükümlülük şeridi: ana ekranın en üstünde tek satır. Rengi kalan
   süreye göre değişiyor — 30 günün altı kırmızı, 90 günün altı sarı. */
.dlbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px solid var(--line);border-left:4px solid var(--brand);border-radius:5px;
  background:var(--panel);padding:10px 16px;margin-bottom:16px}
.dlbar .ust{font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.dlbar .ad{font-size:13.5px;font-weight:600;color:var(--ink);margin-top:1px}
.dlbar .tar{font-size:12px;color:var(--muted);margin-top:1px}
.dlbar .kalan{margin-left:auto;text-align:right;font-size:17px;font-weight:600;color:var(--ink);white-space:nowrap}
.dlbar .kalan small{display:block;font-size:10.5px;font-weight:400;color:var(--muted)}
.dlbar.yakin{border-left-color:var(--warn);background:var(--warn-soft)}
.dlbar.yakin .kalan{color:#6A4B06}
.dlbar.acil{border-left-color:var(--cost);background:var(--cost-soft)}
.dlbar.acil .kalan{color:var(--cost)}
.hlband{border:1px solid var(--line);border-radius:6px;overflow:hidden;margin-bottom:16px}
.hlband .headline{border-radius:0;margin:0;padding:18px 22px}
.hlband .headline .v{font-size:32px}
.hlband .figs{border:0;border-radius:0;border-top:1px solid var(--line)}
.hlband .fig{padding:11px 14px}
.hlband .fig b{font-size:17px}

/* katlanan islemler */
/* Panel eskiden akis icinde aciliyor ve altindaki her seyi asagi
   itiyordu. Simdi dugmenin uzerine oturan bir katman. */
.moreops{margin-left:auto;position:relative}
.moreops>summary{cursor:pointer;font-size:12.5px;font-weight:500;color:var(--brand);
  padding:6px 10px;border:1px solid var(--line);border-radius:5px;background:var(--panel);list-style:none}
.moreops>summary::-webkit-details-marker{display:none}
.moreops>summary::after{content:" ▾";font-size:10px}
.moreops[open]>summary::after{content:" ▴"}
.moreops>summary:hover{border-color:var(--brand);background:#FBFDFE}
.opsbox{position:absolute;right:0;bottom:calc(100% + 8px);z-index:40;min-width:430px;max-width:92vw;
  box-shadow:0 12px 30px rgba(0,30,45,.18);
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;
  padding:14px 16px;background:var(--panel);border:1px solid var(--line);border-radius:6px}
.opsgrp{display:flex;flex-direction:column;gap:7px;align-items:flex-start}
.opsgrp>p{margin:0 0 1px;font-family:var(--mono);font-size:10.5px;letter-spacing:.08em;
  text-transform:uppercase;color:var(--muted)}
.opsgrp .btn{width:100%;justify-content:center}
.opslang{display:flex;flex-direction:column;gap:3px;width:100%;font-size:11px;color:var(--muted)}
.opslang select{width:100%;padding:4px 7px;font-size:12px}
.btn.sec.danger{color:var(--cost);border-color:#E4C3BF}
.btn.sec.danger:hover{background:var(--cost-soft)}
@media(max-width:700px){.moreops{margin-left:0;width:100%}.moreops>summary{text-align:center}}

/* =====================================================================
   İlk giriş: kapsam anketi, karşılama turu, kilitli menü
   ===================================================================== */

/* --- kapsam anketi --- */
.svwrap{max-width:760px;margin:0 auto;padding:40px 0 24px}
.svwrap .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ets);margin:0 0 10px}
.svwrap h1{font-size:28px;line-height:1.2;margin:0 0 10px}
.svwrap .lede{font-size:14.5px;color:var(--muted);line-height:1.6;margin:0 0 28px;max-width:58ch}
.svopts{display:grid;gap:12px;margin-bottom:22px}
.svopt{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start;width:100%;text-align:left;
  background:var(--panel);border:1.5px solid var(--line);border-radius:8px;padding:16px 18px;cursor:pointer}
.svopt:hover{border-color:var(--brand);background:#FBFDFE}
.svopt[aria-pressed=true]{border-color:var(--brand);background:var(--cbam-soft);box-shadow:0 0 0 3px rgba(2,120,181,.12)}
.svopt .tick{width:20px;height:20px;border-radius:50%;border:2px solid var(--line);margin-top:2px;flex:none;position:relative}
.svopt[aria-pressed=true] .tick{border-color:var(--brand);background:var(--brand)}
.svopt[aria-pressed=true] .tick::after{content:"";position:absolute;left:5px;top:2px;width:6px;height:11px;
  border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.svopt b{display:block;font-family:var(--head);font-size:15px;font-weight:600;margin-bottom:3px}
.svopt span{display:block;font-size:12.5px;color:var(--muted);line-height:1.55}
.svopt em{display:block;font-family:var(--mono);font-size:10.5px;font-style:normal;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ets);margin-top:7px}
.svnote{font-size:12px;color:var(--muted);margin:14px 0 0;line-height:1.55}

/* --- kilitli menü öğesi --- */
.navbtn[disabled]{opacity:.42;cursor:not-allowed}
.navbtn[disabled]:hover{background:none;color:var(--rail-txt)}
.navgrp.kilitli>p::after{content:" ·";opacity:.5}
/* Kapsam disi modul: kapali. Gorunur kalir ki kullanici neyin
   mevcut oldugunu bilsin, ama tiklanamaz; sol menudeki "Degistir"
   ile acilir. */
.navbtn.disi{opacity:.42;cursor:not-allowed}
.navbtn.disi:hover{background:none;color:var(--rail-txt)}
.navgrp.disi>p{color:#5E6E76}
.railnote{margin:10px 18px 0;padding:9px 11px;border-radius:5px;background:rgba(255,255,255,.07);
  font-size:11px;line-height:1.5;color:var(--rail-mut)}
.railnote b{display:block;color:#fff;font-weight:500;margin-bottom:2px}
/* display:block: onundeki kapsam metni satir ici oldugu icin
   inline-block'te yan yana yapisiyor ("TR-ETSDegistir") ve
   margin-top satir kirmiyordu. */
.railnotebtn{display:block;margin-top:7px;background:none;border:0;padding:0;
  color:var(--cyan);font:inherit;font-size:11px;cursor:pointer;text-decoration:underline;text-align:left}
.railnotebtn:hover{color:#fff}
.railnotebtn:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.svdugmeler{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
/* senaryo kutusu (sol seritte, koyu zemin) */
.senkutu{padding:13px 18px 14px;border-bottom:1px solid var(--rail-line);background:rgba(255,255,255,.05)}
.senkutu>p{margin:0 0 6px;font-size:10px;letter-spacing:.07em;text-transform:uppercase;
  color:var(--rail-mut);font-weight:600}
.senkutu select{width:100%;background:var(--rail-hi);color:#fff;border:1px solid rgba(255,255,255,.26);
  border-radius:4px;padding:6px 8px;font-size:12.5px;line-height:1.3}
.senkutu select:focus-visible{outline:2px solid var(--cyan);outline-offset:1px}
.senalt{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px}
.senmenu{background:none;border:0;padding:0;color:var(--cyan);font:inherit;font-size:11.5px;
  cursor:pointer;text-decoration:underline;white-space:nowrap}
.senmenu:hover{color:#fff}
.senmenu:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
/* Koyu zeminde ince yazi: acik uclu tonlar kullaniliyor, gövde
   metnindeki koyu yesil/kirmizi seritte okunmuyordu. */
.sendurum{font-size:11px;color:var(--rail-mut);white-space:nowrap}
.sendurum.kaydediliyor{color:var(--sky)}
.sendurum.kayitli{color:var(--leaf)}
.sendurum.hata,.sendurum.cakisma{color:#FFB3A7;font-weight:600}

.optkip{display:flex;gap:18px;flex-wrap:wrap;margin:0 0 14px}
.optkip label{display:flex;align-items:center;gap:6px;font-size:12.5px;cursor:pointer}
.optkip input{width:auto;margin:0}

/* --- karşılama turu --- */
.tourbox{max-width:600px;padding:0;overflow:hidden}
.tourhead{background:var(--rail);color:#fff;padding:24px 26px 22px}
.tourhead .eyebrow{font-family:var(--mono);font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--leaf);margin:0 0 8px}
.tourhead h2{font-family:var(--head);font-size:21px;font-weight:700;color:#fff;margin:0 0 8px;letter-spacing:-.01em}
.tourhead p{font-size:13.5px;line-height:1.6;color:var(--sky);margin:0}
.tourbody{padding:20px 26px 0}
.tourbody h3{margin:0 0 6px;font-size:15px}
.tourbody p{font-size:13.5px;line-height:1.65;color:var(--ink);margin:0 0 12px}
.tourbody ul{margin:0 0 12px;padding-left:18px;font-size:13px;line-height:1.7;color:var(--muted)}
.tourbody ul b{color:var(--ink);font-weight:600}
.tourfig{display:flex;gap:10px;align-items:center;background:var(--panel-2);border:1px solid var(--line-soft);
  border-radius:6px;padding:11px 13px;margin:0 0 14px}
.tourfig i{font-style:normal;font-family:var(--mono);font-size:11px;font-weight:600;color:#fff;background:var(--ets);
  border-radius:3px;padding:3px 7px;flex:none}
.tourfig span{font-size:12.5px;color:var(--muted);line-height:1.5}
.tourfoot{display:flex;align-items:center;gap:10px;padding:16px 26px 20px;border-top:1px solid var(--line-soft);margin-top:6px}
.tourdots{display:flex;gap:5px;flex:1}
.tourdots i{width:7px;height:7px;border-radius:50%;background:var(--line);display:block}
.tourdots i.on{background:var(--brand);width:18px;border-radius:4px}
.tourskip{background:none;border:0;color:var(--muted);font-size:12.5px;cursor:pointer;text-decoration:underline;padding:4px}
.tourskip:hover{color:var(--ink)}
@media(max-width:640px){
  .tourhead,.tourbody{padding-left:18px;padding-right:18px}
  .tourfoot{padding-left:18px;padding-right:18px;flex-wrap:wrap}
  .svwrap{padding-top:22px}
  .svwrap h1{font-size:23px}
}


/* =====================================================================
   YENİ TASARIM — Senaryo kurulumu ve gösterge paneli
   ===================================================================== */
/* --- daha büyük karşılama turu --- */
.tourbox{max-width:880px}
.tourhead{padding:34px 40px 30px}
.tourhead h2{font-size:30px}
.tourhead p{font-size:15.5px}
.tourbody{padding:28px 40px 4px;min-height:240px}
.tourbody p{font-size:15.5px}
.tourbody ul{font-size:14.5px}
.tourfig{padding:15px 17px}
.tourfig span{font-size:14px}
.tourfoot{padding:20px 40px 26px}
.tourfoot .btn{padding:10px 20px;font-size:14px}
.tourdamgalar{display:flex;gap:18px;flex-wrap:wrap;margin:6px 0 18px}

/* --- sol menü: senaryonun yansıması --- */
.yolrail{margin:10px 12px 4px;border:1px solid var(--rail-line);border-radius:6px;background:rgba(255,255,255,.03);overflow:hidden}
.yolrailbas{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;color:#fff;padding:10px 12px;cursor:pointer;
  font-family:var(--head);font-weight:600;font-size:13px;text-align:left}
.yolrailbas:hover,.yolrailbas.on{background:var(--rail-hi)}
.yolrailbas i{font-style:normal;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--leaf);color:var(--rail);font-size:10px}
.yolrailbas small{margin-left:auto;font-family:var(--mono);font-size:10.5px;color:var(--leaf);font-weight:500}
.yolrailbar{height:3px;background:rgba(255,255,255,.1)}
.yolrailbar b{display:block;height:100%;background:linear-gradient(90deg,var(--leaf),var(--sky));transition:width .5s}
.yolrail ol{list-style:none;margin:0;padding:6px 0}
.yolrail li button{display:grid;grid-template-columns:16px 1fr;gap:2px 8px;width:100%;background:none;border:0;color:var(--rail-txt);
  padding:6px 12px;cursor:pointer;text-align:left;font-size:12px;line-height:1.3}
.yolrail li button:hover{background:rgba(255,255,255,.05)}
.yolrail li .nokta{grid-row:span 2;width:12px;height:12px;border-radius:50%;border:2px solid var(--rail-mut);margin-top:2px}
.yolrail li.tamam .nokta{background:var(--leaf);border-color:var(--leaf)}
.yolrail li.simdi .nokta{border-color:#F2B233;box-shadow:0 0 0 0 rgba(242,178,51,.6);animation:yolNabiz 1.6s infinite}
.yolrail li.simdi button{color:#fff;background:rgba(242,178,51,.08)}
.yolrail li small{grid-column:2;color:var(--rail-mut);font-size:10.5px;font-family:var(--mono)}
.yolrail li.tamam small{color:var(--sky)}
@keyframes yolNabiz{0%{box-shadow:0 0 0 0 rgba(242,178,51,.6)}70%{box-shadow:0 0 0 7px rgba(242,178,51,0)}100%{box-shadow:0 0 0 0 rgba(242,178,51,0)}}
.navbtn.yolvurgu{box-shadow:inset 3px 0 0 #F2B233;background:rgba(242,178,51,.12);color:#fff}

/* --- yolculuk ekranı --- */
#v-yol{max-width:1180px}
.yolbas{display:flex;gap:24px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.yolbas .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ets);margin:0 0 6px}
.yolbas h1{font-family:var(--head);font-size:28px;margin:0 0 4px;letter-spacing:-.015em}
.yolbas p.lede{margin:0;color:var(--muted);max-width:62ch}
.yolpas{display:flex;align-items:flex-start;gap:0;max-width:100%;min-width:0}
.adimcizgi{flex:1 1 28px;max-width:28px;min-width:6px;height:2px;background:var(--line);margin-top:16px}

/* adım rozeti */
.damga{--r:var(--brand);display:flex;flex-direction:column;align-items:center;gap:6px;min-width:44px}
.damga i{font-style:normal;width:34px;height:34px;border-radius:50%;background:var(--r);color:#fff;display:grid;place-items:center;
  font-family:var(--head);font-weight:700;font-size:14px;box-shadow:0 0 0 3px var(--panel)}
.damga span{font-family:var(--mono);font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;white-space:nowrap}
.damga.bos i{background:var(--panel);color:var(--muted);border:2px solid var(--line)}
.damga.simdi i{box-shadow:0 0 0 3px var(--panel),0 0 0 5px #F2B233}
.damga.simdi span{color:var(--ink);font-weight:700}
.damga.yeni i{animation:adimBas .5s cubic-bezier(.2,1.5,.4,1)}
.damga.buyuk i{width:64px;height:64px;font-size:28px}
.damga.buyuk span{font-size:11.5px}
@keyframes adimBas{0%{transform:scale(.4);opacity:0}100%{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.damga.yeni i{animation:none}}

.yolilerleme{display:flex;align-items:center;gap:12px;margin:0 0 20px}
.yolbar{flex:1;height:10px;border-radius:6px;background:var(--line-soft);overflow:hidden}
.yolbar i{display:block;height:100%;border-radius:6px;background:linear-gradient(90deg,var(--cbam),var(--ets),#F2B233);transition:width .6s}
.yolilerleme span{font-family:var(--mono);font-size:12px;color:var(--muted);min-width:150px;text-align:right}

.yoladimlar{display:flex;gap:6px;flex-wrap:wrap;margin:-8px 0 18px}
.yoladimlar button{border:1px solid var(--line);background:var(--panel);border-radius:14px;padding:3px 11px;font-size:11.5px;color:var(--muted);cursor:pointer}
.yoladimlar button.tamam{border-color:var(--ets);color:var(--ets);background:var(--ets-soft)}
.yoladimlar button.simdi{border-color:#F2B233;color:#3A2600;background:#FDF3DC;font-weight:600}
.yoladimlar button:disabled{cursor:default;opacity:.55}

.yolkart{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:28px 30px;box-shadow:0 10px 30px rgba(6,40,60,.06);margin-bottom:18px;position:relative}
.yolkart .adimno{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:0 0 8px}
.yolkart h2{font-family:var(--head);font-size:23px;margin:0 0 6px;letter-spacing:-.01em}
.yolkart>p.alt{color:var(--muted);margin:0 0 18px;max-width:72ch;font-size:14px}
.yolkart.cbam{border-top:5px solid var(--cbam)}
.yolkart.ets{border-top:5px solid var(--ets)}
.yolkart.basvuru{border-top:5px solid #7A4FB5}
.yolkart.sonuc{border-top:5px solid #F2B233}
.yolalt{display:flex;gap:10px;justify-content:flex-end;align-items:center;flex-wrap:wrap;margin-top:22px;padding-top:18px;border-top:1px solid var(--line-soft)}
.yolalt .sol{margin-right:auto}
.yolkart .btn{padding:10px 18px;font-size:14px}
.btn.yolgo{background:var(--ets)}
.btn.yolgo:hover{background:#2F5A2A}
.btn.altin{background:#F2B233;color:#3A2600;font-weight:700}
.btn.altin:hover{background:#E1A11F}

.yolsorgu{display:flex;gap:10px}
.yolsorgu input{font-size:16px;padding:11px 13px}
.yolsorgu .btn{flex:none;white-space:nowrap;padding:0 22px}
.yolornek{font-size:12px;color:var(--muted);margin:10px 0 0;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.yolornek button{border:1px dashed var(--line);background:var(--panel-2);border-radius:12px;padding:2px 10px;font-size:12px;cursor:pointer;color:var(--ink)}
.yolsonuc{margin-top:18px;border-radius:8px;padding:16px 18px;border:1px solid var(--line)}
.yolsonuc.ok{background:var(--income-soft);border-color:#B9D7C3}
.yolsonuc.red{background:var(--cost-soft);border-color:#E4C3BF}
.yolsonuc.uyari{background:var(--warn-soft);border-color:#EBD7A6}
.yolsonuc h3{margin:0 0 6px;font-size:16px;display:flex;gap:8px;align-items:center}
.yolsonuc p{margin:0 0 8px;font-size:13.5px}
.yoladay{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.yoladay button{border:1px solid var(--line);background:#fff;border-radius:5px;padding:6px 9px;text-align:left;cursor:pointer;max-width:330px}
.yoladay button:hover{border-color:var(--cbam);background:var(--cbam-soft)}
.yoladay button .mono{display:block;font-size:12px;font-weight:600}
.yoladay button small{display:block;font-size:11px;color:var(--muted);line-height:1.3}
.yoladay .haric{opacity:.55;cursor:not-allowed}

/* sayı ayarlayıcı: ses düğmesi gibi */
.ayar{display:flex;align-items:stretch;gap:4px;flex-wrap:nowrap;min-width:0}
.ayar button{white-space:nowrap;min-width:38px;flex:none;border:1px solid var(--line);background:var(--panel-2);border-radius:5px;font-family:var(--mono);font-size:12px;cursor:pointer;padding:0 6px}
.ayar button:hover{background:var(--cbam-soft);border-color:var(--cbam)}
.ayar button.eksi:hover{background:var(--cost-soft);border-color:var(--cost)}
.ayar button.arti:hover{background:var(--income-soft);border-color:var(--income)}
.ayar input{font-size:17px;font-weight:600;padding:9px 10px;flex:1 1 72px;width:auto;min-width:64px;text-align:center}
.ayar .birim{align-self:center;font-size:12px;color:var(--muted);padding-left:2px;white-space:nowrap;flex:none}
.ayarkutu{display:grid;grid-template-columns:minmax(0,1fr);gap:6px;min-width:0}
input[type=range].ayarkaydir{width:100%;margin:0;padding:0;border:0;background:none;accent-color:var(--ets);height:18px}
.adimturu{display:inline-flex;align-items:center;gap:2px;font-size:11.5px;color:var(--muted);background:var(--panel-2);border:1px solid var(--line);border-radius:16px;padding:2px;margin:4px 0 10px}
.adimturu span{padding:0 6px 0 8px}
.adimturu button{border:0;background:none;border-radius:12px;padding:3px 10px;font-size:11.5px;cursor:pointer;color:var(--muted);font-family:var(--mono)}
.adimturu button.on{background:var(--ink);color:#fff}
.adimturu button:focus-visible{outline:2px solid var(--cbam);outline-offset:1px}
.cipler{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.cipler button{border:1px solid var(--line);background:#fff;border-radius:14px;padding:3px 11px;font-size:12px;cursor:pointer;font-family:var(--mono)}
.cipler button.on{background:var(--ink);color:#fff;border-color:var(--ink)}
.yolform{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,340px),1fr));gap:16px 20px}
.yolform .tam{grid-column:1/-1}
.yolform label{font-size:12.5px;color:var(--ink);font-weight:600}
.yolform .ipucu{font-size:11.5px;color:var(--muted);margin-top:4px}
.secim{display:flex;gap:10px;flex-wrap:wrap}
.secim label{display:flex;gap:8px;align-items:flex-start;border:1px solid var(--line);border-radius:7px;padding:10px 12px;cursor:pointer;font-weight:500;flex:1;min-width:200px}
.secim label:has(input:checked){border-color:var(--cbam);background:var(--cbam-soft)}
.secim input{width:auto;margin:3px 0 0}
.onizleme{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden;margin-top:18px}
.onizleme div{background:var(--panel-2);padding:12px 14px}
.onizleme span{display:block;font-size:11px;color:var(--muted)}
.onizleme b{font-family:var(--mono);font-size:18px}

.yolliste{border:1px solid var(--line);border-radius:7px;overflow:hidden}
.yolliste .satir{display:grid;grid-template-columns:1fr auto auto auto;gap:14px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--line-soft)}
.yolliste .satir:last-child{border-bottom:0}
.yolliste .satir b{display:block}
.yolliste .satir small{color:var(--muted);font-size:11.5px}
.ikonlar{display:inline-flex;gap:6px}
.ikondug{position:relative;width:32px;height:32px;border-radius:7px;border:1px solid var(--line);background:var(--panel);cursor:pointer;display:grid;place-items:center;font-size:16px;line-height:1;color:var(--muted);padding:0}
.ikondug.duz:hover,.ikondug.duz:focus-visible{border-color:var(--cbam);color:var(--cbam);background:var(--cbam-soft)}
.ikondug.sil{font-size:20px}
.ikondug.sil:hover,.ikondug.sil:focus-visible{border-color:var(--cost);color:var(--cost);background:var(--cost-soft)}
.ikondug::after{content:attr(data-ipucu);position:absolute;bottom:calc(100% + 7px);left:50%;transform:translateX(-50%);background:var(--ink);color:#fff;font-size:11.5px;font-weight:600;
  padding:4px 9px;border-radius:5px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .12s;z-index:5;font-family:var(--sans)}
.ikondug:hover::after,.ikondug:focus-visible::after{opacity:1}
.onerildi{display:inline-flex;align-items:center;gap:3px;background:var(--ets-soft);color:var(--ets);border:1px solid #B9D7C3;border-radius:10px;padding:1px 8px;font-size:11px;font-weight:700;vertical-align:1px}
.uyarietiket,.eksiketiket{display:inline-block;margin-top:4px;border-radius:10px;padding:1px 8px;font-size:11px;font-weight:700}
.uyarietiket{background:var(--cost-soft);color:var(--cost)}
.eksiketiket{background:var(--warn-soft);color:#8A6208;margin-right:4px}
.yolliste .satir.duzenleniyor{background:#FDF3DC}
.pilotuyari{margin-top:8px;font-size:12.5px;background:var(--cost-soft);color:var(--cost);border-radius:6px;padding:8px 10px}
select option.kapali{color:#9AA5AB}
.katsec label{min-width:180px}
.altbaslik{margin:18px 0 10px;font-size:15px}
.limitbilgi{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 16px;font-size:12.5px;background:var(--panel-2);border:1px solid var(--line);border-radius:7px;padding:9px 12px;margin-bottom:6px}
.limitbilgi.asim{background:var(--cost-soft);border-color:#E4C3BF;color:var(--cost)}
.yolbos{border:1px dashed var(--line);border-radius:7px;padding:22px;text-align:center;color:var(--muted)}

.yolkutlama{text-align:center;padding:16px 0 4px}
.yolkutlama .damga{margin:0 auto 18px}
.yolkutlama h2{font-size:26px}

/* senaryo özeti: form biçiminde (bir yere başvuru yapılmaz) */
.form{border:1px solid var(--line);border-radius:8px;overflow:hidden;margin-bottom:16px}
.form>header{display:flex;align-items:center;gap:12px;background:var(--panel-2);padding:11px 16px;border-bottom:1px solid var(--line)}
.form>header .harf{font-family:var(--mono);font-weight:700;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;color:#fff;background:var(--ink);font-size:12px}
.form>header h3{margin:0;font-size:15px;flex:1}
.form>header button{background:none;border:0;color:var(--link);cursor:pointer;font-size:12.5px;text-decoration:underline}
.form .ic{padding:14px 16px}
.form table{width:100%;border-collapse:collapse;font-size:13px}
.form th{text-align:left;font-size:11px;color:var(--muted);font-weight:600;padding:5px 8px;border-bottom:1px solid var(--line-soft)}
.form td{padding:7px 8px;border-bottom:1px solid var(--line-soft)}
.form td.n,.form th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
.form tfoot td{font-weight:700;border-bottom:0}
.alanlar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.alanlar div span{display:block;font-size:11px;color:var(--muted)}
.alanlar div b{font-family:var(--mono);font-size:14px}
.alanlar .btn{white-space:normal;max-width:100%}
.beyan{display:flex;gap:10px;align-items:flex-start;background:#FBF8F1;border:1px dashed #D9CBA6;border-radius:7px;padding:12px 14px;font-size:13px}
.beyan input{width:auto;margin-top:3px}

/* onay penceresi */
.yolonay .modalbox{max-width:520px;text-align:center;padding:30px 30px 26px}
.yolonay .damga{margin:0 auto 14px}
.yolonay h2{font-family:var(--head);font-size:22px}
.yolonay p{color:var(--muted)}
.yolonay .btnrow{justify-content:center;margin-top:18px}

/* sonuç */
.yolsonucbas{display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.yolsonucbas .bilgi{flex:1;min-width:260px}
.yolkpi{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 0}
.yolkpi>div{border-radius:9px;padding:14px 16px;color:#fff;position:relative;overflow:hidden}
.yolkpi>div span{display:block;font-size:11.5px;opacity:.85}
.yolkpi>div b{display:block;font-family:var(--mono);font-size:22px;margin-top:4px;letter-spacing:-.02em}
.yolkpi>div small{display:block;font-size:11px;opacity:.85;margin-top:2px}
.yolkpi .k1{background:linear-gradient(135deg,#001E2D,#0B4A6B)}
.yolkpi .k2{background:linear-gradient(135deg,#3F7539,#5E9A55)}
.yolkpi .k3{background:linear-gradient(135deg,#0278B5,#3FA3D6)}
.yolkpi .k4{background:linear-gradient(135deg,#A32A21,#D0574B)}
.yolkpi .k4.iyi{background:linear-gradient(135deg,#2E6B3F,#4F9A62)}
.yolduzen{display:grid;grid-template-columns:minmax(300px,380px) minmax(0,1fr);gap:18px;align-items:start}
.panelkutu{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:18px;position:sticky;top:14px;min-width:0}
.panelkutu h3{margin:0 0 4px;font-family:var(--head);font-size:16px}
.panelkutu>p{margin:0 0 14px;font-size:12px;color:var(--muted)}
.param{padding:12px 0;border-top:1px solid var(--line-soft)}
.param>label{display:flex;justify-content:space-between;font-size:12.5px;color:var(--ink);font-weight:600;margin-bottom:7px}
.param>label em{font-style:normal;font-family:var(--mono);font-size:11px;color:var(--muted);font-weight:500}
.param .ayar input{font-size:15px;min-width:80px;padding:7px 6px}
.param .ayar button{min-width:38px;font-size:11px;flex:none;padding:0 6px}
.param .ayar input{flex:1 1 0;width:auto;min-width:56px}
.param input[type=range]{width:100%;margin:8px 0 0;accent-color:var(--ets);padding:0;border:0}
.grafikler{display:grid;gap:18px;grid-template-columns:minmax(0,1fr);min-width:0}
.grafikkutu,.ikili>*{min-width:0}
.grafikkutu{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:16px 18px}
.grafikkutu h3{margin:0 0 2px;font-size:15px}
.grafikkutu>p{margin:0 0 10px;font-size:12px;color:var(--muted)}
.grafikkutu svg{width:100%;height:auto;display:block}
#yolG3{max-width:300px;margin:0 auto}
.grafikkutu svg text{font-size:14px;fill:var(--muted);font-family:var(--sans)}
.grafikkutu svg text.deger{fill:var(--ink);font-family:var(--mono);font-size:13.5px}
#yolSelale .ikili{grid-template-columns:minmax(0,1fr)}
.grafikalt{margin:16px 0 6px;font-size:13px;color:var(--muted);font-weight:600}
.cubuklar{display:grid;gap:14px}
.cubuk{display:grid;gap:4px;min-width:0}
.cad{font-size:13px;color:var(--ink);line-height:1.35;overflow-wrap:anywhere}
.cbar{display:flex;align-items:center;height:22px}
.cbar.ince{height:13px}
.cbar span{display:block;height:100%;border-radius:3px;min-width:2px}
.cbar b{margin-left:8px;font-family:var(--mono);font-size:12.5px;font-weight:600;white-space:nowrap;color:var(--ink)}
.cbar.ince b{font-weight:500;color:var(--muted);font-size:11.5px}
.cgelir span{display:block;height:5px;border-radius:2px;background:var(--leaf)}
.cnot{font-size:12px;font-family:var(--mono)}
.grafikkutu svg text.opt{fill:#8A6208;font-weight:700}
.ikili{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:18px}
.lejant{display:flex;gap:14px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:8px}
.lejant i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:5px;vertical-align:-1px}
.optkart{border-radius:9px;padding:16px 18px;background:linear-gradient(135deg,#FDF3DC,#FBF8F1);border:1px solid #EBD7A6;margin-top:14px}
.optkart h4{margin:0 0 6px;font-size:15px;display:flex;align-items:center;gap:8px}
.optkart p{margin:0 0 8px;font-size:13px}
.tablokutu{overflow-x:auto}
.tablokutu table{width:100%;border-collapse:collapse;font-size:13px}
.tablokutu th{text-align:left;font-size:11px;color:var(--muted);font-weight:600;padding:7px 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.tablokutu td{padding:8px;border-bottom:1px solid var(--line-soft);vertical-align:middle}
.tablokutu td.n,.tablokutu th.n{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums}
/* tabloda hacim: üstte sayı kutusu (birimiyle), altta dört oransal düğme */
.tablokutu .ayar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:4px;min-width:210px}
.tablokutu .ayar input{grid-row:1;grid-column:1/5;font-size:13px;min-width:0;width:100%;padding:5px 6px}
.tablokutu .ayar .birim{grid-row:1;grid-column:5}
.tablokutu .ayar button{min-width:30px;font-size:11px;padding:0 5px;flex:none}
.tur{display:inline-block;font-size:10px;font-weight:700;letter-spacing:.06em;border-radius:3px;padding:1px 6px;color:#fff}
.tur.c{background:var(--cbam)}.tur.e{background:var(--ets)}

/* tost ve konfeti */
.yoltost{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);background:var(--ink);color:#fff;border-radius:30px;
  padding:10px 20px;font-size:13.5px;z-index:950;opacity:0;transition:all .35s;box-shadow:0 10px 30px rgba(0,0,0,.25);display:flex;gap:10px;align-items:center}
.yoltost.on{opacity:1;transform:translateX(-50%) translateY(0)}
.yoltost i{font-style:normal;background:#F2B233;color:#3A2600;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:12px;font-weight:700}
.konfeti{position:fixed;inset:0;pointer-events:none;z-index:940;overflow:hidden}
.konfeti i{position:absolute;top:-14px;width:9px;height:14px;border-radius:2px;animation:konfetiDus 1.9s cubic-bezier(.3,.6,.5,1) forwards}
@keyframes konfetiDus{to{transform:translateY(105vh) rotate(720deg);opacity:.2}}

@media(max-width:1320px){
  .yolduzen,.ikili{grid-template-columns:minmax(0,1fr)}
  .panelkutu{position:static;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:0 22px}
  .panelkutu>h3,.panelkutu>p{grid-column:1/-1}
}
@media(max-width:1000px){
  .yolkpi{grid-template-columns:repeat(2,minmax(0,1fr))}
  .alanlar{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:640px){
  .ayar{flex-wrap:wrap;row-gap:6px}
  .ayar input{flex:1 1 100%;order:-1}
  .ayar button{flex:1 1 0}
  .damga span{font-size:9px;letter-spacing:.04em}
  .yolkart .btn{white-space:normal}
  .yolkart{padding:20px 16px}
  .yolform{grid-template-columns:1fr}
  .onizleme{grid-template-columns:1fr}
  .yolsorgu{flex-direction:column}
  .yolliste .satir{grid-template-columns:1fr auto}
  .tourhead,.tourbody,.tourfoot{padding-left:18px;padding-right:18px}
  .tourhead h2{font-size:23px}
}

/* ===== gösterge paneli ===== */
#v-yol.panomodu .yolpas,#v-yol.panomodu .yolilerleme{display:none}
.panokap{scroll-margin-top:16px}
.panobas{display:flex;gap:16px;align-items:flex-end;justify-content:space-between;flex-wrap:wrap;margin-bottom:14px}
.panobas h2{font-family:var(--head);font-size:21px;margin:0 0 6px;letter-spacing:-.01em}
.panodurum{display:flex;gap:6px;flex-wrap:wrap;margin:0}
.cip{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;border-radius:12px;padding:3px 10px;background:var(--panel-2);border:1px solid var(--line);color:var(--muted)}
.cip.ok{background:var(--income-soft);border-color:#B9D7C3;color:var(--income)}
.cip.uyari{background:var(--warn-soft);border-color:#EBD7A6;color:#8A6208}
.panoeylem{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.panoeylem .geriyinele{display:inline-flex;gap:4px;margin-right:6px}
.pano .yolkpi{margin:0 0 16px}
.panosekme{display:flex;gap:2px;box-shadow:inset 0 -1px 0 var(--line);margin:0 0 18px;overflow-x:auto;overflow-y:hidden;scrollbar-width:none}
.panosekme::-webkit-scrollbar{display:none}
.panosekme button{background:none;border:0;border-bottom:3px solid transparent;padding:10px 14px;font-size:13.5px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.panosekme button:hover{color:var(--ink)}
.panosekme button.on{color:var(--ink);border-bottom-color:#F2B233}
.panosekme button:focus-visible{outline:2px solid var(--cbam);outline-offset:-2px}
.panosayfa[hidden]{display:none}
.panogrid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(280px,1fr);gap:18px;align-items:start}
.panogrid>div{display:grid;gap:18px;min-width:0}
.panoiki{display:grid;gap:18px}
/* kalemler ayrı bir grup değil: panelin öteki parametreleriyle aynı akışta */
.kalemler{display:contents}
.panelgrup{margin:14px 0 2px;padding-top:12px;border-top:2px solid var(--line);font-size:13.5px;grid-column:1/-1}
.panelgrup small{color:var(--muted);font-weight:500;font-size:11.5px}
.param.kalem>label span{display:inline;min-width:0}
.param.kalem>label>span{overflow-wrap:anywhere}
.kalembilgi{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11.5px;color:var(--muted);margin-top:6px;font-family:var(--mono)}
.kalembilgi b{margin-left:auto;color:var(--ink)}
.optsatir{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.optsatir label{font-size:12.5px;font-weight:600}
.optsatir input{width:64px;padding:6px;text-align:center}
.optsatir .btn{margin-left:auto}
.dikkat{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.dikkat li{border:1px solid var(--line-soft);border-left:4px solid var(--muted);border-radius:6px;padding:9px 12px;font-size:12.5px;display:grid;gap:3px;background:var(--panel)}
.dikkat li b{font-size:12.5px}
.dikkat li span{color:var(--ink)}
.dikkat li small{display:block;color:var(--muted);font-family:var(--mono);font-size:10.5px;margin-top:2px}
.dikkat li .btn{justify-self:start;margin-top:4px}
.dikkat .dikkatbtn{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}
.dikkat .dikkatbtn .btn{margin-top:0}
.dikkat li.risk{border-left-color:var(--cost)}
.dikkat li.uyari{border-left-color:#F2B233}
.dikkat li.iyi{border-left-color:var(--income)}
.dikkat li.bilgi{border-left-color:var(--cbam)}
.dikkat li.takvim{border-left-color:var(--ets)}
.panoozet{display:grid}
.ozsatir{display:grid;grid-template-columns:70px minmax(0,1fr) auto;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid var(--line-soft);font-size:12.5px}
.ozsatir:last-child{border-bottom:0}
.ozsatir span{color:var(--muted);font-size:11.5px}
.ozsatir b{font-family:var(--mono);font-weight:600;font-size:12px;font-variant-numeric:tabular-nums}
.ozsatir button{background:none;border:0;color:var(--link);text-decoration:underline;cursor:pointer;font-size:12px}
@media(max-width:1100px){.panogrid{grid-template-columns:minmax(0,1fr)}.panogrid>.sag{order:-1}}

/* ===== tek sayfa: bölümler ===== */
.yolbolum{background:var(--panel);border:1px solid var(--line);border-radius:12px;margin-bottom:16px;transition:box-shadow .3s,border-color .3s;scroll-margin-top:16px}
.yolbolum .ybbas{display:flex;align-items:center;gap:14px;padding:16px 20px}
.ybno{--r:var(--brand);flex:none;width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-family:var(--head);font-weight:700;font-size:16px;color:#fff;background:var(--r)}
.ybbaslik{flex:1;min-width:0}
.ybbaslik h2{margin:0;font-family:var(--head);font-size:18px;letter-spacing:-.01em;overflow-wrap:anywhere}
.ybbaslik h2 small{font-family:var(--mono);font-size:11px;color:var(--muted);font-weight:500;letter-spacing:.06em;margin-left:6px}
.ybbaslik p{margin:2px 0 0;font-size:12.5px;color:var(--muted)}
.ybetiket{flex:none;background:#F2B233;color:#3A2600;font-size:11px;font-weight:700;letter-spacing:.04em;border-radius:12px;padding:4px 11px;animation:yolNabizEtiket 2s infinite}
@keyframes yolNabizEtiket{0%,100%{box-shadow:0 0 0 0 rgba(242,178,51,.55)}50%{box-shadow:0 0 0 6px rgba(242,178,51,0)}}
.ybkilit{flex:none;font-size:11.5px;color:var(--muted)}
.yolbolum.aktif{border:2px solid #F2B233;box-shadow:0 14px 40px rgba(242,178,51,.18)}
.yolbolum.tamam .ybno{background:var(--ets)}
.yolbolum.kilitli{opacity:.5;background:var(--panel-2)}
.yolbolum.kilitli .ybno{background:#B7C0C4}
.yolbolum.sirada .ybno{background:#B7C0C4}
.ybic{padding:0 20px 20px}
.ybic .yolkart{box-shadow:none;margin-bottom:0;border-radius:10px}
.ybsoru{font-family:var(--head);font-size:21px;margin:0 0 6px;letter-spacing:-.01em}
.yolparla{animation:yolParla 1.6s}
@keyframes yolParla{0%,100%{background:transparent}25%{background:#FDF3DC;box-shadow:0 0 0 3px #F2B233}}
.eslesme{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:10px;align-items:center;padding:6px 0;border-bottom:1px solid var(--line-soft);font-size:13px}
.optkart.dis{background:var(--panel-2);border-color:var(--line)}
.hedefgiris{font-size:14px;max-width:70ch}
.hedefayar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0 4px}
.hedefayar label{font-weight:600;font-size:13px}
.hedefayar input{width:140px;font-size:17px;font-weight:600;text-align:center}
.hedefayar span{color:var(--muted);font-size:12.5px}
.hedefozet{margin:16px 0 10px;font-size:13.5px}
.oneriler{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:14px;margin-bottom:14px}
.oneriKart{border:1px solid var(--line);border-radius:9px;padding:14px 16px;background:var(--panel)}
.oneriKart h4{margin:0 0 8px;font-size:15px}
.oneriKart p{margin:0 0 8px;font-size:13px}
.oneriKart ul{margin:0 0 10px;padding-left:18px;font-size:13px}
.hedefvar{color:var(--income);font-weight:700;white-space:nowrap}
.hedefyok{color:#8A6208;font-weight:600}
#yolOpt{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
#yolOpt .optkart{margin-top:14px}
.optkart small{color:var(--muted);font-size:11.5px}

/* ===== sol menü: senaryonun kendisi ===== */
.yolrail.senaryo .yolrailbas span{flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.3}
.ysgovde{padding:4px 0 8px}
.ysbolum{padding:2px 0}
.ysbas{display:flex;align-items:center;gap:8px;width:100%;background:none;border:0;color:#fff;padding:7px 12px 4px;cursor:pointer;font-size:12.5px;font-weight:600;text-align:left}
.ysbas .nokta{width:11px;height:11px;border-radius:50%;border:2px solid var(--rail-mut);flex:none}
.ysbolum.tamam .ysbas .nokta{background:var(--leaf);border-color:var(--leaf)}
.ysbolum.simdi{background:rgba(242,178,51,.09);box-shadow:inset 3px 0 0 #F2B233}
.ysbolum.simdi .ysbas .nokta{border-color:#F2B233;animation:yolNabiz 1.6s infinite}
.ysbas em{margin-left:auto;font-style:normal;font-size:9.5px;color:#F2B233;font-family:var(--mono);letter-spacing:.06em;text-transform:uppercase}
.ysbolum ul{list-style:none;margin:0;padding:0 0 4px 31px}
.ysbolum li button{display:block;width:100%;background:none;border:0;color:var(--rail-txt);padding:3px 10px 3px 0;cursor:pointer;text-align:left;font-size:11.5px;line-height:1.3}
.ysbolum li button:hover span{color:#fff;text-decoration:underline}
.ysbolum li small{display:block;color:var(--rail-mut);font-family:var(--mono);font-size:10px}
.ysbolum li.ekle button{color:var(--leaf)}
.ysbolum li.simdi button span{color:#F2B233;font-weight:600}
.eskimenu{margin:8px 0 0;border-top:1px solid var(--rail-line)}
.eskimenu>summary{list-style:none;cursor:pointer;padding:10px 18px;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--rail-mut);font-family:var(--mono)}
.eskimenu>summary::-webkit-details-marker{display:none}
.eskimenu>summary::before{content:"▸ "}
.eskimenu[open]>summary::before{content:"▾ "}
.eskimenu>summary:hover{color:#fff}

/* ===== ek özellikler ===== */
.yolkart.oyun{border-top:5px solid #F2B233}
.oneri{display:flex;gap:6px;flex-wrap:wrap;align-items:center;background:#FBF8F1;border:1px dashed #D9CBA6;border-radius:8px;padding:9px 12px;margin:0 0 14px;font-size:12.5px}
.oneri span{color:#8C7A4E;font-weight:600}
.oneri button{border:1px solid #D9CBA6;background:#fff;border-radius:14px;padding:3px 11px;font-size:12px;cursor:pointer}
.oneri button:hover{background:#FDF3DC}
.onerildi{color:#8A6208;font-size:10.5px}
.geriyinele{display:inline-flex;gap:6px;margin-left:8px;vertical-align:middle}
.geriyinele .btn{padding:3px 9px;font-size:11.5px}
.yolkpi>div em.kfark{display:block;font-style:normal;font-size:10.5px;margin-top:5px;opacity:.95;background:rgba(255,255,255,.16);border-radius:3px;padding:1px 6px;width:max-content;max-width:100%}
#yolSelale h4{margin:0 0 4px;font-size:13px}
#yolSelale h4 small{font-family:var(--mono);color:var(--muted);font-weight:500;font-size:10.5px}
#yolSelale svg{width:100%;height:auto;display:block}
#yolSelale svg text{font-size:10.5px;fill:var(--muted)}
#yolSelale svg text.deger{fill:var(--ink);font-family:var(--mono)}
#yolSelale svg text.opt{fill:var(--link);font-size:10px;text-decoration:underline}
.selaleadim{cursor:pointer}
.selaleadim:hover rect,.selaleadim:focus rect{filter:brightness(1.12);stroke:#F2B233;stroke-width:2}
.selaleadim:focus{outline:none}
.selalealt{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:baseline;font-size:12.5px;color:var(--muted);margin-top:6px}
.selalealt b{color:var(--ink);font-family:var(--mono)}
.selalealt .sonucnet{margin-left:auto;cursor:pointer;color:var(--cost);border-bottom:1px dashed var(--cost)}
.neden{margin-top:12px;background:var(--panel-2);border:1px solid var(--line-soft);border-radius:8px;padding:12px 14px;font-size:13px}
.neden h4{margin:0 0 6px;font-size:14px}
.neden p{margin:0 0 6px}
.neden .ipucu,.ipucu{font-size:11.5px;color:var(--muted)}
.fark{font-style:normal;font-family:var(--mono);font-size:12px;border-radius:3px;padding:1px 6px}
.fark.iyi{color:var(--income);background:var(--income-soft)}
.fark.kotu{color:var(--cost);background:var(--cost-soft)}
.fark.not{color:var(--muted);background:var(--panel-2)}
.fark.sifir{color:var(--muted)}
#yolHedefSonuc table{margin-top:10px}
.hedefkotu{color:var(--cost);font-size:12.5px;margin:10px 0 0;font-weight:600}
.hedefiyi{color:var(--income);font-size:12.5px;margin:10px 0 0;font-weight:600}
.param#yolHedefKutu{grid-column:1/-1}
.yssurum{display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:7px 12px 2px;font-size:10.5px;color:var(--rail-mut);font-family:var(--mono)}
.yssurum span{margin-right:4px;letter-spacing:.08em;text-transform:uppercase}
.yssurum button{background:rgba(255,255,255,.07);border:1px solid var(--rail-line);color:#fff;border-radius:10px;padding:1px 8px;font-size:10.5px;cursor:pointer;font-family:var(--mono)}
.yssurum button:hover{background:var(--rail-hi)}
/* sezon */
/* pazarlık oyunu */
.pzuyari{background:#FBF8F1;border:1px dashed #D9CBA6;border-radius:7px;padding:9px 12px;font-size:12.5px;margin:12px 0 16px;color:var(--ink)}
.pzuyari b{color:#8A6208;margin-right:4px}
.pzlobi{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:22px;margin-top:6px}
.pzlobi h4{margin:0 0 10px;font-size:14px}
.pzfirmalar{display:grid;gap:8px}
.pzfirma{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:8px;padding:10px 12px;cursor:pointer}
.pzfirma.on{border-color:var(--ets);background:var(--ets-soft)}
.pzfirma input{width:auto;margin:3px 0 0}
.pzfirma span{display:grid;gap:2px;min-width:0}
.pzfirma small{color:var(--muted);font-size:11.5px}
.pzfirma em{font-style:normal;font-family:var(--mono);font-size:11.5px;color:var(--ink)}
.pzveya{text-align:center;color:var(--muted);font-size:12px;margin:12px 0 8px}
.pzkatil{display:flex;gap:8px}
.pzkatil input{flex:1 1 0;min-width:0;text-transform:uppercase;letter-spacing:.3em;font-family:var(--mono);font-size:18px;text-align:center}
.pzhata{display:none;margin-top:10px;font-size:12.5px;color:var(--cost);background:var(--cost-soft);border-radius:6px;padding:8px 10px}
.pzhata.on{display:block}
.pzbekle{text-align:center;padding:10px 0 16px}
.pzbekle>span{display:block;font-size:12px;color:var(--muted);letter-spacing:.1em;text-transform:uppercase}
.pzbekle>b{display:block;font-family:var(--mono);font-size:46px;letter-spacing:.25em;margin:4px 0 8px}
.pzbekle p{max-width:52ch;margin:0 auto 10px}
.pzust{display:grid;grid-template-columns:auto auto minmax(0,1fr) auto;gap:14px 20px;align-items:center;padding-bottom:4px}
.pzturlar{display:flex;gap:4px;flex-wrap:wrap}
.pzturlar span{border:1px solid var(--line);border-radius:12px;padding:3px 10px;font-size:11.5px;color:var(--muted)}
.pzturlar span.gecti{background:var(--panel-2)}
.pzturlar span.simdi{border-color:#F2B233;background:#FDF3DC;color:#3A2600;font-weight:700}
.pzsure b{display:block;font-family:var(--mono);font-size:24px;font-variant-numeric:tabular-nums}
.pzsure small{color:var(--muted);font-size:11px}
.pzsure.az b{color:var(--cost)}
.pzfiyat{display:flex;gap:10px;align-items:center;min-width:0}
.pzfiyat div{display:grid;min-width:0}
.pzfiyat b{font-family:var(--mono);font-size:18px}
.pzfiyat small{color:var(--muted);font-size:11px}
.pzspark{width:110px;height:auto;flex:none}
.pzhazir{display:grid;justify-items:end;gap:3px}
.pzhazir small{color:#8A6208;font-size:11px}
.pzhazir span{font-size:12.5px;color:var(--muted)}
.pzizgara{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.pzsol,.pzsag{display:grid;gap:16px;min-width:0}
.pzkart{border:1px solid var(--line);border-radius:10px;padding:14px 16px;min-width:0;background:var(--panel)}
.pzkart h4{margin:0 0 10px;font-size:14px}
.pzkart h4 small{color:var(--muted);font-weight:500}
.pzpoz{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.pzpoz span{display:block;font-size:11px;color:var(--muted)}
.pzpoz b{font-family:var(--mono);font-size:17px}
.pzpoz .acik b{color:var(--cost)}
.pzpoz .fazla b{color:var(--income)}
.pzpoz b.eksi{color:var(--cost)}
.pzpoz b.arti{color:var(--income)}
.pzform{display:grid;gap:6px}
.pzform label{font-size:12px;font-weight:600;margin-top:6px}
.pzyon{display:grid;grid-template-columns:1fr 1fr;border:1px solid var(--line);border-radius:7px;overflow:hidden}
.pzyon button{border:0;background:var(--panel-2);padding:8px;font-size:13px;cursor:pointer;color:var(--muted)}
.pzyon button.on{background:var(--ink);color:#fff;font-weight:600}
.pzdugmeler{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.pzpiyasa{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--muted);border-top:1px solid var(--line-soft);padding-top:10px;margin-top:6px}
.pzkarsibilgi{margin:0;font-size:12px;background:#FDF3DC;border-radius:6px;padding:6px 9px;color:#3A2600}
.pzbaslik{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:10px 0 6px}
.pzbaslik:first-child{margin-top:0}
.pzteklif{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;border:1px solid var(--line-soft);border-left:4px solid var(--cbam);border-radius:6px;padding:8px 10px;margin-bottom:6px}
.pzteklif.benim{border-left-color:var(--muted)}
.pzteklif div{display:grid;gap:2px;min-width:0}
.pzteklif b{font-size:12.5px}
.pzteklif span{font-family:var(--mono);font-size:12.5px}
.pzteklif em{font-size:12px;color:var(--ink)}
.pzteklif small{font-size:11px;color:var(--muted)}
.pzdug{display:flex!important;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.pzkapali{font-size:11.5px;color:var(--muted);padding:2px 0}
.pzkayit{display:grid;gap:6px;max-height:260px;overflow:auto;font-size:12.5px}
.pzkayit div{display:grid;gap:1px;padding:6px 9px;border-radius:7px;background:var(--panel-2);max-width:92%}
.pzkayit div.ben{justify-self:end;background:var(--ets-soft)}
.pzkayit div.sistem{background:none;border:1px dashed var(--line);max-width:100%}
.pzkayit small{font-size:10.5px;color:var(--muted)}
.pzmesaj{display:flex;gap:6px;margin-top:10px}
.pzmesaj input{flex:1 1 0;min-width:0}
.yolkart.oyun .tablokutu b.eksi{color:var(--cost)}
.yolkart.oyun .tablokutu b.arti{color:var(--income)}
@media(max-width:1180px){.pzizgara{grid-template-columns:minmax(0,1fr)}}
@media(max-width:900px){.pzust{grid-template-columns:minmax(0,1fr) auto}.pzfiyat{grid-column:1/-1}}

@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}