/* Resisco Monitor — v10 (TASK-018 / RULE-0001 / EX-0109).
   Tasarım sistematiği: Fira Sans ailesi zorunlu (yerel woff2, OFL 1.1); yoğun modüler
   masa — dar sabit üst şerit, ince piyasa bandı, ~12 kolon panel ızgarası (8-10px
   aralık), 6-8px köşeler, ince ayırıcılar; tek vurgu rengi bakır — anlamlar sabit:
   bakır = dikkat/vurgu etkileşim, yeşil = normal/olumlu, kızıl = uyarı/olumsuz.
   Koyu grafit / açık kırık beyaz anlamsal yüzeyler; ağır gölge/ticker/animasyon yok. */

/* --- Fira Sans (yerel, OFL 1.1; lisans: assets/fonts/OFL.txt) --- */
@font-face {
  font-family: 'Fira Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/fira-sans-italic-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/fira-sans-italic-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-400-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-400-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-500-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-500-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-600-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-600-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-700-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Fira Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/fonts/fira-sans-normal-700-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* --- tasarım jetonları --- */
:root{
  /* 21st Graphite uyarlaması (kullanıcı kararı): koyu grafit nötr yüzeyler */
  --bg:#1a1a1a;
  --surface:#202020;
  --surface-2:#262626;
  --border:#353535;
  --border-soft:#2b2b2b;
  --text:#e8e8e8;
  --head:#f0f0f0;
  --muted:#a3a3a3;
  --faint:#8a8a8a;
  --accent:#d8a45c;        /* tek vurgu: bakır — dikkat/etkileşim */
  --ok:#7fc9a4;            /* normal / olumlu, yukarı yönlü değişim */
  --down:#ef9f8b;          /* uyarı / olumsuz, aşağı yönlü değişim */
  --sans:"Fira Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --radius-m:8px; --radius-s:6px;
  --gap:12px;              /* kutular arası TEK boşluk (TASK-031: her yerde aynı) */
  --gap-block:var(--gap);  /* bölüm arası = kutu arası */
  --pad-panel:11px 14px 12px;
  --shadow:0 1px 0 rgba(255,255,255,.03) inset;
}

*{box-sizing:border-box}
[hidden]{display:none!important}
html{color-scheme:dark}
/* — açık tema (TASK-016): basit ters çevirme değil; anlamsal palet — */
html[data-theme="light"]{
  color-scheme:light;
  /* Graphite resmî açık paleti: bg #f0f0f0, card #f5f5f5, border #d0d0d0, primary #606060 */
  --bg:#f0f0f0;
  --surface:#f5f5f5;
  --surface-2:#ebebeb;
  --border:#d0d0d0;
  --border-soft:#dedede;
  --text:#1f1f1f;
  --head:#101010;
  --muted:#606060;
  --faint:#6a6a6a;
  --accent:#b0741f;
  --ok:#1f7a4d;
  --down:#b3362a;
  --shadow:none;
}
body{
  margin:0 auto; max-width:1440px;
  padding:clamp(8px,1.2vw,18px) clamp(10px,1.6vw,24px) 14px;
  min-height:100vh; display:flex; flex-direction:column; gap:var(--gap-block);
  background:var(--bg);
  color:var(--text);
  font:13.5px/1.5 var(--sans);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
.num, .m-value, .m-delta, .clock span, #last-check, .wx-day-t{font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1}
:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:3px}

/* — dar sabit üst şerit (EX-0109): marka + şehir + nav + hava + saat + tema tek satır — */
.topstrip{
  position:sticky; top:0; z-index:60;
  display:flex; align-items:center; gap:8px 14px; flex-wrap:wrap;
  min-height:46px;
  padding:6px 10px;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid var(--border-soft); border-radius:var(--radius-m);
}
.ts-left{display:flex; align-items:center; gap:12px; flex-wrap:wrap; min-width:0}
.brand-name{margin:0; font:700 16px/1.1 var(--sans); letter-spacing:.02em; color:var(--head); white-space:nowrap}
.ts-right{display:flex; align-items:center; gap:10px; margin-left:auto}
.clock span{font:600 14.5px/1 var(--sans); letter-spacing:.02em; color:var(--text)}
.top-sep{width:1px; height:20px; background:var(--border-soft)}

.city-select{position:relative}
.city-btn{
  display:flex; align-items:center; gap:7px;
  font:600 12.5px/1 var(--sans); color:var(--text);
  background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-s);
  padding:6px 10px; cursor:pointer;
}
.city-btn:hover{border-color:var(--accent)}
.city-dot{width:6px; height:6px; border-radius:50%; background:var(--ok); flex:none}
.city-caret{color:var(--muted); transition:transform .12s ease}
.city-btn[aria-expanded="true"] .city-caret{transform:rotate(180deg)}
.city-popover{
  position:absolute; top:calc(100% + 6px); left:0; z-index:80; min-width:170px;
  margin:0; padding:4px; list-style:none;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m);
  box-shadow:0 14px 36px rgba(0,0,0,.45); max-height:min(420px, 60vh); overflow:auto;
}
.city-opt{
  padding:7px 9px; border-radius:4px; cursor:pointer; color:var(--text);
  font:500 12.5px/1.2 var(--sans); display:flex; align-items:center; gap:8px;
}
.city-opt::before{content:''; width:6px; height:6px; border-radius:50%; background:transparent; flex:none}
.city-opt.selected{color:var(--head); font-weight:600}
.city-opt.selected::before{background:var(--accent)}
.city-opt.active{background:color-mix(in srgb,var(--text) 7%,transparent)}

/* — görünüm navigasyonu: kapsüller üst şerit içinde — */
.viewnav{display:flex; align-items:center; gap:2px; flex-wrap:wrap}
.viewnav-link{
  font:600 12.5px/1 var(--sans); color:var(--muted); text-decoration:none;
  padding:7px 13px 8px; border-radius:999px;
  transition:color .15s ease, background .15s ease;
}
.viewnav-link:hover{color:var(--head); background:color-mix(in srgb,var(--text) 5%,transparent)}
.viewnav-link.active{
  color:var(--head);
  background:color-mix(in srgb,var(--accent) 14%,transparent);
  box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 38%,transparent);
}
.viewnav-link:focus-visible{outline:2px solid var(--accent); outline-offset:2px}

/* — hava çipi + popover — */
.wx-box{position:relative}
.wx-chip{
  display:flex; align-items:center; gap:6px;
  font:600 12.5px/1 var(--sans); color:var(--text);
  background:var(--surface-2); border:1px solid var(--border); border-radius:var(--radius-s);
  padding:6px 10px; cursor:pointer; max-width:280px;
}
.wx-chip:hover{border-color:var(--accent)}
.wx-chip:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.wx-popover{
  position:absolute; top:calc(100% + 8px); right:0; z-index:80; width:320px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m);
  box-shadow:0 18px 44px rgba(0,0,0,.5); padding:12px 14px 10px;
}
.wx-pop-title{margin:0 0 3px; font:700 12.5px/1.3 var(--sans); letter-spacing:.02em; color:var(--head); display:flex; align-items:center; gap:6px; flex-wrap:wrap}
.wx-pop-note{margin:0 0 8px; color:var(--muted); font-size:11.5px}
.wx-days{list-style:none; margin:0; padding:0; display:flex; flex-direction:column}
.wx-day{
  display:grid; grid-template-columns:64px 1fr 84px auto; gap:4px 10px; align-items:baseline;
  padding:6px 2px; border-top:1px solid var(--border-soft);
  font-size:12px; color:var(--text);
}
.wx-day:first-child{border-top:0}
.wx-day-name{color:var(--head); font-weight:600}
.wx-day-sym{color:var(--muted)}
.wx-day-t{color:var(--text); text-align:right}
.wx-day-extra{color:var(--faint); text-align:right; font-size:11px; white-space:nowrap}

/* — tema düğmesi (Theme Toggle 1216 güneş/ay) — */
.theme-btn{
  display:flex; align-items:center; justify-content:center;
  width:30px; height:30px; border-radius:var(--radius-s); cursor:pointer;
  color:var(--muted); background:var(--surface-2); border:1px solid var(--border);
}
.theme-btn:hover{border-color:var(--accent); color:var(--head)}
.theme-btn:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
html[data-theme="dark"] .theme-btn .ic-sun{display:none}
html[data-theme="light"] .theme-btn .ic-moon{display:none}

/* — bağlantı hatası bandı — */
.conn-error{
  border:1px solid color-mix(in srgb,var(--down) 40%,transparent);
  background:color-mix(in srgb,var(--down) 8%,transparent);
  color:var(--down); border-radius:var(--radius-m); padding:9px 13px; font-size:12.5px;
}
.conn-error code{font-family:var(--sans); font-size:12px; font-weight:600}

/* — piyasa: Panel'de küçük ikincil köşe (mini); Finans'ta bant + ayrıntı — */
.marketband{margin:0}
.market-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--gap)}
.market-grid > *{min-width:0}
.m-card{
  background:var(--surface); border:1px solid var(--border-soft);
  border-radius:var(--radius-m); padding:8px 12px 7px;
  display:flex; flex-direction:column; gap:3px; min-height:64px;
}
.m-card.off{border-style:dashed; background:color-mix(in srgb,var(--surface) 55%,transparent)}
.m-label{color:var(--muted); font:600 11px/1.25 var(--sans); letter-spacing:.02em; overflow-wrap:anywhere}
.m-value{font:600 17.5px/1.05 var(--sans); letter-spacing:-.01em; color:var(--text)}
.m-value small{font:500 10.5px var(--sans); color:var(--muted); margin-left:4px; letter-spacing:0}
.m-row{display:flex; align-items:center; justify-content:space-between; gap:8px}
.m-spark{flex:none; overflow:visible}
.m-spark path{fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.m-spark.up path{stroke:var(--ok)}
.m-spark.down path{stroke:var(--down)}
.m-when{color:var(--faint); font:500 10.5px/1 var(--sans); margin-left:6px}
.m-state{color:var(--muted); font:600 12px/1.3 var(--sans)}
.m-line{min-height:13px}
.m-delta{font:600 11px/1 var(--sans)}
.m-delta.up{color:var(--ok)}
.m-delta.down{color:var(--down)}
.m-note{color:var(--muted); font-size:10.5px; line-height:1.35}
.m-card .m-line{display:flex; align-items:center; gap:2px; min-height:14px; margin-top:auto}
.m-empty-note{color:var(--muted); font-size:12.5px; padding:12px 4px}
/* mini varyant: Panel'in alt köşesinde ikincil ölçek (kullanıcı yönlendirmesi:
   döviz/altın/BTC ana odağı kaplamaz) */
.market-grid.mini .m-card{min-height:52px; padding:6px 10px 5px}
.market-grid.mini .m-value{font-size:14.5px}
.market-grid.mini .m-label{font-size:10px}
.market-grid.mini .m-spark{display:none}  /* mini köşede trend yok — Finans'ta var */
@media (max-width:980px){
  .market-grid{grid-template-columns:repeat(2,minmax(0,1fr))}  /* dar ekranda 2×2 */
}
@media (max-width:640px){
  .ia-mid .stocks-grid, .quad .stocks-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
  .stocks-grid{grid-template-columns:repeat(2, minmax(0,1fr)); min-width:0}
  .stock-cell{min-width:0}
  .stock-label small{white-space:normal}
  .m-line{flex-wrap:wrap}
  .m-value{font-size:15px; overflow-wrap:anywhere}
  .m-row{flex-wrap:wrap}
}

/* — Panel ızgarası: ~12 kolon; sol 8 kolon göstergeler, sağ 4 kolon haber akışı — */
.layout{display:block}
.panel-grid{
  display:grid; grid-template-columns:minmax(0,8fr) minmax(280px,4fr);
  gap:var(--gap-block); align-items:start;
}
.pl-main{display:flex; flex-direction:column; gap:var(--gap-block); min-width:0}
/* TASK-019: yakıt/stok/gelişmeler/tahmin ilk ekranda birlikte — kompakt kuadron */
.quad{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--gap); align-items:stretch}
.quad .panel{padding:8px 11px 9px}
.quad .panel-head{margin-bottom:4px; padding-bottom:3px}
.quad .panel-head h2{font-size:10.5px}
@media (max-width:1120px){ .quad{grid-template-columns:1fr} }
.fuel-value{font-size:13px}
.stock-cell{padding:5px 8px 5px}
.stock-value{font-size:14px}
#energy-news .news-item, #en-energy-news .news-item{padding:2px 0}
#energy-news .news-title, #en-energy-news .news-title{font-size:11px; line-height:1.3}
#energy-news .nf-sub, #en-energy-news .nf-sub{margin:2px 0 3px}
.steo-row{padding:2px 0}
.stocks-grid{gap:6px}
.pl-news{min-width:0}
@media (max-width:1120px){
  .panel-grid{grid-template-columns:1fr}  /* haber akışı ana içeriğin altına iner */
}

/* — paneller: tek satır başlık + ince ayırıcı; ağır gölge yok — */
.panel{
  background:var(--surface);
  border:1px solid var(--border); border-radius:var(--radius-m);
  padding:var(--pad-panel);
}
.panel-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid var(--border-soft);
}
.panel-head h2{
  margin:0; font:700 11.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--head); white-space:nowrap;
}
.panel-note{color:var(--muted); font-size:11.5px; text-align:right}
.panel-note.all-link{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent); white-space:nowrap}
.panel-note.all-link:hover{border-bottom-style:solid}
.panel.offline{background:color-mix(in srgb,var(--surface) 82%,transparent)}
.panel.offline .panel-head h2{color:var(--muted)}

/* — duo: PTF eğrisi + üretim karması eşit yükseklikte yan yana — */
.duo{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--gap); align-items:stretch}
@media (max-width:980px){ .duo{grid-template-columns:1fr} }
@media (max-width:760px){ .duo{grid-template-columns:1fr} }

/* — PTF eğrisi (22249 uyarlaması): başlıkta değer + aralık; ≤~200px çizim — */
.ptf-panel{display:flex; flex-direction:column}
.ptf-curve{display:flex; flex-direction:column; flex:1}
.ptf-head{
  display:flex; align-items:baseline; gap:8px 14px; flex-wrap:wrap;
  margin-bottom:6px;
}
.ptf-head-val{display:flex; align-items:baseline; gap:8px}
.ptf-head-val span{font:600 21px/1 var(--sans); letter-spacing:-.01em; color:var(--text)}
.ptf-head-val small{font:500 11px var(--sans); color:var(--muted)}
.ptf-head-range{margin-left:auto; color:var(--muted); font:500 11.5px/1 var(--sans)}
.ptf-chart{position:relative}
.ptf-svg{width:100%; height:auto; max-height:210px; display:block; overflow:visible; touch-action:pan-y}
.ptf-svg:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.ptf-hair{stroke:color-mix(in srgb,var(--text) 8%,transparent); stroke-width:1; stroke-dasharray:3 6}
.ptf-line{fill:none; stroke:var(--accent); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.ptf-baseline{stroke:var(--border-soft); stroke-width:1}
.ptf-hour-label{fill:var(--faint); font-size:10px; text-anchor:middle; font-family:var(--sans)}
.ptf-ylabel{fill:var(--faint); font-size:10px; text-anchor:start; font-family:var(--sans)}
.ptf-idx-dot{fill:var(--accent)}
.ptf-index-svg{max-height:130px}
.ptf-line.idx{stroke-width:1.4}
.ptf-date-label{fill:var(--faint); font-size:10px; text-anchor:middle; font-family:var(--sans)}
.ptf-cross{stroke:color-mix(in srgb,var(--text) 22%,transparent); stroke-width:1}
.ptf-dot{fill:var(--accent); stroke:var(--surface); stroke-width:1.5}
.ptf-tip{
  position:absolute; z-index:5; pointer-events:none;
  background:var(--surface); border:1px solid var(--border); border-radius:4px;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  font:600 11px/1 var(--sans); color:var(--text); padding:4px 7px; white-space:nowrap;
}
.ptf-curve-meta{
  display:flex; align-items:baseline; gap:5px 14px; flex-wrap:wrap;
  margin-top:6px; font:500 11px/1.3 var(--sans); color:var(--muted);
}
.ptf-index{padding:4px 0}

/* — üretim karması: 26545 Partition Bar uyarlaması — */
.gen-panel{display:flex; flex-direction:column}
.gen-mix{display:flex; flex-direction:column; flex:1}
.gen-summary{margin:0 0 7px; font:600 12px/1.3 var(--sans); color:var(--head); display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.pb-bar{
  display:flex; flex-direction:row; gap:3px; width:100%;
  margin:2px 0 8px;
}
.pb-seg{display:flex; flex-direction:column; min-width:0; flex-basis:0; flex-shrink:1}
/* oranlar inline flex-grow ile: boşluk/gap'ler kullanılabilir alandan düşüldükten
   sonra paylarla bölünür — %100+gap taşması olamaz (kullanıcı ara incelemesi) */
.pb-line{width:100%; height:11px; border-radius:3px}
.pb-1 .pb-line{background:var(--accent)}
.pb-2 .pb-line{background:color-mix(in srgb,var(--accent) 78%,var(--surface-2))}
.pb-3 .pb-line{background:color-mix(in srgb,var(--accent) 60%,var(--surface-2))}
.pb-4 .pb-line{background:color-mix(in srgb,var(--accent) 44%,var(--surface-2))}
.pb-5 .pb-line{background:color-mix(in srgb,var(--accent) 30%,var(--surface-2))}
.pb-6 .pb-line{background:color-mix(in srgb,var(--accent) 20%,var(--surface-2))}
.pb-rest .pb-line{background:color-mix(in srgb,var(--text) 16%,transparent)}
.gen-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px}
.gen-row{
  display:grid; grid-template-columns:minmax(90px,1fr) 46px 92px;
  gap:4px 10px; align-items:baseline;
  font:500 11.5px/1.35 var(--sans);
  padding:2px 0;
}
.gen-name{color:var(--text); overflow-wrap:anywhere}
.gen-share{color:var(--muted); text-align:right; font-size:11px}
.gen-mwh{color:var(--faint); text-align:right; font-size:10.5px; white-space:nowrap}
.gen-ie{margin:6px 0 0; font:500 11px/1.3 var(--sans); color:var(--faint)}

/* — resmî yayınlar listesi — */
.official-list{list-style:none; margin:0; padding:0}
.official-item{padding:6px 2px; border-bottom:1px solid var(--border-soft)}
.official-item:last-child{border-bottom:0}
.off-period{
  color:var(--faint); font:500 10.5px/1 var(--sans); margin-right:6px;
  border:1px solid var(--border-soft); border-radius:3px; padding:2px 5px;
}

/* — bugünün durumu: durum satırı + sinyal çipleri — */
.today-summary{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  margin:0 0 7px; font-size:12.5px; color:var(--head); font-weight:500;
}
.today-summary .dot{width:8px; height:8px; border-radius:50%; background:var(--faint); flex:none}
.today-summary.ok .dot{background:var(--ok)}
.today-summary.watch .dot{background:var(--accent)}
.today-summary.alert .dot{background:var(--down)}
.dev-chips{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px}
.dev-chip{
  display:flex; align-items:baseline; gap:4px 10px; flex-wrap:wrap;
  background:var(--surface-2); border:1px solid var(--border-soft);
  border-left:3px solid color-mix(in srgb,var(--faint) 50%,transparent);
  border-radius:var(--radius-s); padding:7px 11px 6px;
}
.dev-chip.important{border-left-color:var(--accent)}
.dev-chip-title{font:600 13px/1.3 var(--sans); color:var(--text); overflow-wrap:anywhere}
.dev-chip-meta{margin-left:auto; color:var(--faint); font:500 10.5px/1.3 var(--sans); white-space:nowrap}
.dev-empty{
  border:1px dashed var(--border); border-radius:var(--radius-s);
  padding:8px 12px; text-align:left;
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
  display:flex; flex-direction:row; align-items:baseline; gap:6px 12px; flex-wrap:wrap;
}
.dev-empty-title{margin:0; font:600 12.5px/1.3 var(--sans); color:var(--ok); flex:none}
.dev-empty.alert .dev-empty-title{color:var(--down)}
.dev-empty-sub{margin:0; color:var(--muted); font-size:11.5px; line-height:1.4; min-width:0; overflow-wrap:anywhere}

/* — Finans ayrıntı satırları — */
@media (max-width:640px){
  .panel .panel-head h2{white-space:normal; letter-spacing:.08em; min-width:0; overflow-wrap:anywhere}
  .panel-head{flex-wrap:wrap}

  .fuel-value small{display:block; margin-left:0}
  .fuel-value{white-space:normal; font-size:12.5px; justify-self:start; max-width:100%; overflow-wrap:anywhere}
  .fuel-row{grid-template-columns:minmax(0,1fr) auto; align-items:start}
  .fuel-value{grid-column:1}
  .fuel-when, .fuel-note{grid-column:1 / -1; justify-self:start}
  .fuel-note{grid-column:1 / -1; justify-self:start; white-space:normal}
}

/* — haber akışı: panel sağ sütunu (ülke + şehir aynı bakışta) — */
.newsfeed .panel-head{margin-bottom:7px; padding-bottom:6px}
.nf-block{display:flex; flex-direction:column; min-width:0}
.nf-sub{
  display:flex; align-items:baseline; justify-content:space-between; gap:8px;
  font:700 10.5px/1.2 var(--sans); letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); margin:2px 0 5px;
}
.nf-name{color:var(--head)}
.nf-timing{font:500 10px/1.2 var(--sans); letter-spacing:0; text-transform:none; color:var(--faint); text-align:right; overflow-wrap:anywhere}
.nf-div{height:1px; margin:9px 0; background:linear-gradient(to right, transparent, var(--border) 12%, var(--border) 88%, transparent)}
.news-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px}
.news-item{padding:5px 2px; border-bottom:1px solid var(--border-soft)}
.news-item:last-child{border-bottom:0}
.news-title{
  display:block; color:var(--text); text-decoration:none; font:500 12px/1.4 var(--sans);
  overflow-wrap:anywhere;
}
.news-title:hover{color:var(--accent)}
.news-title:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.news-meta{display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-top:2px}
.news-src-name{color:var(--muted); font-size:10px; overflow-wrap:anywhere}
.news-time{color:var(--faint); font-size:10px; flex:none}
.news-nodate{font-style:italic}
.news-empty{border:1px dashed var(--border); border-radius:var(--radius-m); padding:18px 14px; text-align:center}
.news-empty.slim{padding:9px 12px; text-align:left}
.news-src{margin-top:8px; padding-top:7px; border-top:1px solid var(--border-soft)}
.news-src-line{color:var(--muted); font-size:10.5px; margin-bottom:4px}
.news-kind{
  font:600 9px/1 var(--sans); letter-spacing:.07em; text-transform:uppercase;
  color:var(--faint); border:1px dashed var(--border); border-radius:3px; padding:2px 4px;
}
.news-kind.scope{margin-left:5px; vertical-align:1px}
.news-kind.topic{
  margin-left:5px; vertical-align:1px;
  color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  background:color-mix(in srgb,var(--accent) 8%,transparent); border-style:solid;
}
.news-kind.stale{
  color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);
  background:color-mix(in srgb,var(--accent) 10%,transparent); border-style:solid;
}

.col-main{display:flex; flex-direction:column; gap:var(--gap-block)}
main{display:flex; flex-direction:column; gap:var(--gap-block); min-width:0}
/* TASK-019: yakıt/stok/gelişmeler/tahmin ilk ekranda birlikte — kompakt kuadron */
.quad{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--gap); align-items:stretch}
.quad .panel{padding:8px 11px 9px}
.quad .panel-head{margin-bottom:4px; padding-bottom:3px}
.quad .panel-head h2{font-size:10.5px}
@media (max-width:1120px){ .quad{grid-template-columns:1fr} }
.fuel-value{font-size:13px}
.stock-cell{padding:5px 8px 5px}
.stock-value{font-size:14px}
#energy-news .news-item, #en-energy-news .news-item{padding:2px 0}
#energy-news .news-title, #en-energy-news .news-title{font-size:11px; line-height:1.3}
#energy-news .nf-sub, #en-energy-news .nf-sub{margin:2px 0 3px}
.steo-row{padding:2px 0}
.stocks-grid{gap:6px}
.pl-news{min-width:0}
@media (max-width:1120px){
  .panel-grid{grid-template-columns:1fr}  /* haber akışı ana içeriğin altına iner */
}

/* — paneller: tek satır başlık + ince ayırıcı; ağır gölge yok — */
.panel{
  background:var(--surface);
  border:1px solid var(--border); border-radius:var(--radius-m);
  padding:var(--pad-panel);
}
.panel-head{
  display:flex; align-items:baseline; justify-content:space-between; gap:10px;
  margin-bottom:8px; padding-bottom:6px; border-bottom:1px solid var(--border-soft);
}
.panel-head h2{
  margin:0; font:700 11.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--head); white-space:nowrap;
}
.panel-note{color:var(--muted); font-size:11.5px; text-align:right}
.panel-note.all-link{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent); white-space:nowrap}
.panel-note.all-link:hover{border-bottom-style:solid}
.panel.offline{background:color-mix(in srgb,var(--surface) 82%,transparent)}
.panel.offline .panel-head h2{color:var(--muted)}

/* — duo: PTF eğrisi + üretim karması eşit yükseklikte yan yana — */
.duo{display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,1fr); gap:var(--gap); align-items:stretch}
@media (max-width:980px){ .duo{grid-template-columns:1fr} }
@media (max-width:760px){ .duo{grid-template-columns:1fr} }

/* — PTF eğrisi (22249 uyarlaması): başlıkta değer + aralık; ≤~200px çizim — */
.ptf-panel{display:flex; flex-direction:column}
.ptf-curve{display:flex; flex-direction:column; flex:1}
.ptf-head{
  display:flex; align-items:baseline; gap:8px 14px; flex-wrap:wrap;
  margin-bottom:6px;
}
.ptf-head-val{display:flex; align-items:baseline; gap:8px}
.ptf-head-val span{font:600 21px/1 var(--sans); letter-spacing:-.01em; color:var(--text)}
.ptf-head-val small{font:500 11px var(--sans); color:var(--muted)}
.ptf-head-range{margin-left:auto; color:var(--muted); font:500 11.5px/1 var(--sans)}
.ptf-chart{position:relative}
.ptf-svg{width:100%; height:auto; max-height:210px; display:block; overflow:visible; touch-action:pan-y}
.ptf-svg:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.ptf-hair{stroke:color-mix(in srgb,var(--text) 8%,transparent); stroke-width:1; stroke-dasharray:3 6}
.ptf-line{fill:none; stroke:var(--accent); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.ptf-baseline{stroke:var(--border-soft); stroke-width:1}
.ptf-hour-label{fill:var(--faint); font-size:10px; text-anchor:middle; font-family:var(--sans)}
.ptf-ylabel{fill:var(--faint); font-size:10px; text-anchor:start; font-family:var(--sans)}
.ptf-idx-dot{fill:var(--accent)}
.ptf-index-svg{max-height:130px}
.ptf-line.idx{stroke-width:1.4}
.ptf-date-label{fill:var(--faint); font-size:10px; text-anchor:middle; font-family:var(--sans)}
.ptf-cross{stroke:color-mix(in srgb,var(--text) 22%,transparent); stroke-width:1}
.ptf-dot{fill:var(--accent); stroke:var(--surface); stroke-width:1.5}
.ptf-tip{
  position:absolute; z-index:5; pointer-events:none;
  background:var(--surface); border:1px solid var(--border); border-radius:4px;
  box-shadow:0 6px 18px rgba(0,0,0,.35);
  font:600 11px/1 var(--sans); color:var(--text); padding:4px 7px; white-space:nowrap;
}
.ptf-curve-meta{
  display:flex; align-items:baseline; gap:5px 14px; flex-wrap:wrap;
  margin-top:6px; font:500 11px/1.3 var(--sans); color:var(--muted);
}
.ptf-index{padding:4px 0}

/* — üretim karması: 26545 Partition Bar uyarlaması — */
.gen-panel{display:flex; flex-direction:column}
.gen-mix{display:flex; flex-direction:column; flex:1}
.gen-summary{margin:0 0 7px; font:600 12px/1.3 var(--sans); color:var(--head); display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.pb-bar{
  display:flex; flex-direction:row; gap:3px; width:100%;
  margin:2px 0 8px;
}
.pb-seg{display:flex; flex-direction:column; min-width:0; flex-basis:0; flex-shrink:1}
/* oranlar inline flex-grow ile: boşluk/gap'ler kullanılabilir alandan düşüldükten
   sonra paylarla bölünür — %100+gap taşması olamaz (kullanıcı ara incelemesi) */
.pb-line{width:100%; height:11px; border-radius:3px}
.pb-1 .pb-line{background:var(--accent)}
.pb-2 .pb-line{background:color-mix(in srgb,var(--accent) 78%,var(--surface-2))}
.pb-3 .pb-line{background:color-mix(in srgb,var(--accent) 60%,var(--surface-2))}
.pb-4 .pb-line{background:color-mix(in srgb,var(--accent) 44%,var(--surface-2))}
.pb-5 .pb-line{background:color-mix(in srgb,var(--accent) 30%,var(--surface-2))}
.pb-6 .pb-line{background:color-mix(in srgb,var(--accent) 20%,var(--surface-2))}
.pb-rest .pb-line{background:color-mix(in srgb,var(--text) 16%,transparent)}
.gen-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:2px}
.gen-row{
  display:grid; grid-template-columns:minmax(90px,1fr) 46px 92px;
  gap:4px 10px; align-items:baseline;
  font:500 11.5px/1.35 var(--sans);
  padding:2px 0;
}
.gen-name{color:var(--text); overflow-wrap:anywhere}
.gen-share{color:var(--muted); text-align:right; font-size:11px}
.gen-mwh{color:var(--faint); text-align:right; font-size:10.5px; white-space:nowrap}
.gen-ie{margin:6px 0 0; font:500 11px/1.3 var(--sans); color:var(--faint)}

/* — resmî yayınlar listesi — */
.official-list{list-style:none; margin:0; padding:0}
.official-item{padding:6px 2px; border-bottom:1px solid var(--border-soft)}
.official-item:last-child{border-bottom:0}
.off-period{
  color:var(--faint); font:500 10.5px/1 var(--sans); margin-right:6px;
  border:1px solid var(--border-soft); border-radius:3px; padding:2px 5px;
}

/* — bugünün durumu: durum satırı + sinyal çipleri — */
.today-summary{
  display:flex; align-items:center; gap:9px; flex-wrap:wrap;
  margin:0 0 7px; font-size:12.5px; color:var(--head); font-weight:500;
}
.today-summary .dot{width:8px; height:8px; border-radius:50%; background:var(--faint); flex:none}
.today-summary.ok .dot{background:var(--ok)}
.today-summary.watch .dot{background:var(--accent)}
.today-summary.alert .dot{background:var(--down)}
.dev-chips{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px}
.dev-chip{
  display:flex; align-items:baseline; gap:4px 10px; flex-wrap:wrap;
  background:var(--surface-2); border:1px solid var(--border-soft);
  border-left:3px solid color-mix(in srgb,var(--faint) 50%,transparent);
  border-radius:var(--radius-s); padding:7px 11px 6px;
}
.dev-chip.important{border-left-color:var(--accent)}
.dev-chip-title{font:600 13px/1.3 var(--sans); color:var(--text); overflow-wrap:anywhere}
.dev-chip-meta{margin-left:auto; color:var(--faint); font:500 10.5px/1.3 var(--sans); white-space:nowrap}
.dev-empty{
  border:1px dashed var(--border); border-radius:var(--radius-s);
  padding:8px 12px; text-align:left;
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
  display:flex; flex-direction:row; align-items:baseline; gap:6px 12px; flex-wrap:wrap;
}
.dev-empty-title{margin:0; font:600 12.5px/1.3 var(--sans); color:var(--ok); flex:none}
.dev-empty.alert .dev-empty-title{color:var(--down)}
.dev-empty-sub{margin:0; color:var(--muted); font-size:11.5px; line-height:1.4; min-width:0; overflow-wrap:anywhere}

/* — Finans ayrıntı satırları — */

/* — haber akışı: panel sağ sütunu (ülke + şehir aynı bakışta) — */
.newsfeed .panel-head{margin-bottom:7px; padding-bottom:6px}
.nf-block{display:flex; flex-direction:column; min-width:0}
.nf-sub{
  display:flex; align-items:baseline; justify-content:space-between; gap:8px;
  font:700 10.5px/1.2 var(--sans); letter-spacing:.12em; text-transform:uppercase;
  color:var(--muted); margin:2px 0 5px;
}
.nf-name{color:var(--head)}
.nf-timing{font:500 10px/1.2 var(--sans); letter-spacing:0; text-transform:none; color:var(--faint); text-align:right; overflow-wrap:anywhere}
.nf-div{height:1px; margin:9px 0; background:linear-gradient(to right, transparent, var(--border) 12%, var(--border) 88%, transparent)}
.news-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:1px}
.news-item{padding:5px 2px; border-bottom:1px solid var(--border-soft)}
.news-item:last-child{border-bottom:0}
.news-title{
  display:block; color:var(--text); text-decoration:none; font:500 12px/1.4 var(--sans);
  overflow-wrap:anywhere;
}
.news-title:hover{color:var(--accent)}
.news-title:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.news-meta{display:flex; justify-content:space-between; align-items:baseline; gap:8px; margin-top:2px}
.news-src-name{color:var(--muted); font-size:10px; overflow-wrap:anywhere}
.news-time{color:var(--faint); font-size:10px; flex:none}
.news-nodate{font-style:italic}
.news-empty{border:1px dashed var(--border); border-radius:var(--radius-m); padding:18px 14px; text-align:center}
.news-empty.slim{padding:9px 12px; text-align:left}
.news-src{margin-top:8px; padding-top:7px; border-top:1px solid var(--border-soft)}
.news-src-line{color:var(--muted); font-size:10.5px; margin-bottom:4px}
.news-kind{
  font:600 9px/1 var(--sans); letter-spacing:.07em; text-transform:uppercase;
  color:var(--faint); border:1px dashed var(--border); border-radius:3px; padding:2px 4px;
}
.news-kind.scope{margin-left:5px; vertical-align:1px}
.news-kind.topic{
  margin-left:5px; vertical-align:1px;
  color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 35%,transparent);
  background:color-mix(in srgb,var(--accent) 8%,transparent); border-style:solid;
}
.news-kind.stale{
  color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent);
  background:color-mix(in srgb,var(--accent) 10%,transparent); border-style:solid;
}

/* — Haberler görünümü: Ülke solda / Şehir sağda, ortada ince dikey ayraç — */
.col-main{display:flex; flex-direction:column; gap:var(--gap-block)}
main{display:flex; flex-direction:column; gap:var(--gap-block)}
.col-main.channels{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:var(--gap-block); align-items:start; position:relative}
.col-main.channels::before{
  content:''; position:absolute; left:50%; top:10px; bottom:10px; width:1px; pointer-events:none;
  background:linear-gradient(to bottom, transparent, var(--border) 12%, var(--border) 88%, transparent);
}
@media (max-width:760px){
  .col-main.channels{grid-template-columns:1fr}
  .col-main.channels::before{display:none}  /* alt alta: dikey ayraç kalkar */
}

/* — rozetler — */
.badge{
  display:inline-block; font:700 9.5px/1 var(--sans); letter-spacing:.09em; text-transform:uppercase;
  padding:3px 6px; border-radius:3px; margin-right:5px;
}
.badge.stale{color:var(--accent); background:color-mix(in srgb,var(--accent) 10%,transparent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.badge.partial{color:var(--down); background:color-mix(in srgb,var(--down) 8%,transparent); border:1px solid color-mix(in srgb,var(--down) 40%,transparent)}
.badge.unavailable{color:var(--faint); background:transparent; border:1px dashed var(--border)}

/* — bağlı olmayan alanlar — */
.off-list{display:flex; flex-direction:column; gap:2px}
.off-row{display:flex; align-items:baseline; gap:10px; padding:5px 2px; color:var(--muted)}
.off-dot{width:6px; height:6px; border-radius:50%; border:1px dashed var(--border); flex:none; align-self:center}
.off-label{font:600 12px/1.3 var(--sans); color:var(--muted); min-width:150px}
.off-why{font-size:11.5px; color:var(--faint); line-height:1.4; overflow-wrap:anywhere}

/* — dip Kaynaklar envanteri — */
.foot{border-top:1px solid var(--border-soft); padding-top:12px; display:flex; flex-direction:column; gap:6px; color:var(--muted); font-size:12.5px}
.foot-line{color:var(--faint); font-size:12px}
.sources-block{margin-top:2px}
.sources-title{margin:0 0 7px; font:700 11.5px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase; color:var(--head)}
.inv-list{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px}
.inv-row{
  display:grid; grid-template-columns:minmax(180px, 300px) 1fr auto; gap:4px 14px; align-items:baseline;
  padding:4px 8px; border:1px solid var(--border-soft); border-radius:6px;
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
}
.inv-name{font:600 11.5px/1.3 var(--sans); color:var(--text); overflow-wrap:anywhere}
.inv-name a{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent)}
.inv-name a:hover{border-bottom-style:solid}
.inv-il{color:var(--faint); font-weight:500; margin-left:6px; font-size:11px}
.inv-usage{color:var(--muted); font-size:11px; line-height:1.4; overflow-wrap:anywhere}
.inv-st{font:700 9.5px/1 var(--sans); letter-spacing:.08em; text-transform:uppercase; border-radius:3px; padding:3px 6px; white-space:nowrap}
.inv-st.ok{color:var(--ok); border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.inv-st.stale{color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent); background:color-mix(in srgb,var(--accent) 10%,transparent)}
.inv-st.off{color:var(--faint); border:1px dashed var(--border)}
.foot a{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent)}
.foot a:hover{border-bottom-style:solid}
.foot-note{color:var(--muted)}
.rules summary{cursor:pointer; color:var(--muted); font-size:12.5px}
.rules summary:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.rules-table{border-collapse:collapse; margin-top:8px; font-size:12.5px; max-width:860px}
.rules-table th,.rules-table td{border:1px solid var(--border-soft); padding:5px 9px; text-align:left; vertical-align:top}
.rules-table th{color:var(--muted); font:700 10.5px/1 var(--sans); letter-spacing:.1em; text-transform:uppercase}
.rules-table td:first-child{color:var(--muted)}
.rules-src{color:var(--faint); font-size:11.5px}
.data-error{color:var(--down); font-size:12.5px}
.data-error code{font-family:var(--sans); font-size:12px; font-weight:600}


/* — TASK-019: yakıt tablosu / stok ızgarası / STEO / enerji gelişmeleri — */
.fuel-table{display:flex; flex-direction:column}
@media (min-width:761px){
  .fuel-table{display:grid; grid-template-columns:1fr 1fr; column-gap:18px}
  .fuel-table .fuel-row:nth-last-child(-n+1){grid-column:1 / -1}  /* panel 2 sütunda tek kalan satır */
  .fuel-table.detail .fuel-row:nth-last-child(-n+1){grid-column:auto}  /* enerji 3×3: son kalem tam satır olmaz */
  .fuel-table .fuel-row{border-bottom:1px solid var(--border-soft)}
}
.fuel-row{
  display:grid; grid-template-columns:minmax(120px,1.1fr) auto auto auto;
  gap:2px 12px; align-items:baseline;
  padding:6px 2px; border-bottom:1px solid var(--border-soft);
}
.fuel-row:last-child{border-bottom:0}
.fuel-label{color:var(--text); font:500 12.5px/1.3 var(--sans); overflow-wrap:anywhere}
.fuel-label .fuel-geo{display:block; color:var(--faint); font-size:10px; font-weight:400; margin-top:1px}
.fuel-value{font:600 15px/1 var(--sans); letter-spacing:-.01em; color:var(--text); white-space:nowrap}
.fuel-value small{font:500 10px var(--sans); color:var(--muted); margin-left:3px}
.fuel-when{color:var(--faint); font:500 10.5px/1 var(--sans); white-space:nowrap; justify-self:end}
.fuel-note{color:var(--faint); font-size:10.5px; white-space:nowrap; justify-self:end}

/* ilk ekran sıkılaştırma: Panel kuadronunda kompakt satırlar (EX-0109) */
.fuel-row{padding:2px 0; grid-template-columns:minmax(110px,1fr) auto auto}
.fuel-label{font-size:11.5px; line-height:1.25}
.fuel-label .fuel-geo{display:inline; margin-left:5px}
.fuel-value{font-size:13px}

.stocks-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:8px}
.stock-cell{
  background:var(--surface-2); border:1px solid var(--border-soft); border-radius:var(--radius-s);
  padding:8px 10px 7px; display:flex; flex-direction:column; gap:2px;
}
.stock-label{color:var(--muted); font:600 10.5px/1.3 var(--sans)}
.stock-label small{display:block; color:var(--faint); font-weight:400; font-size:9.5px}
.stock-value{font:600 17px/1 var(--sans); color:var(--text)}
.stock-delta{font:600 10.5px/1 var(--sans)}
.stock-delta.up{color:var(--ok)}
.stock-delta.down{color:var(--down)}
.stock-when{color:var(--faint); font:500 9.5px/1.2 var(--sans)}

.steo-summary{display:flex; flex-direction:column}
.steo-row{
  display:grid; grid-template-columns:minmax(120px,1.2fr) auto auto auto;
  gap:2px 12px; align-items:baseline;
  padding:6px 2px; border-bottom:1px solid var(--border-soft);
}
.steo-row:last-child{border-bottom:0}
.steo-cls{
  font:600 9px/1 var(--sans); letter-spacing:.07em; text-transform:uppercase;
  border-radius:3px; padding:2px 5px; white-space:nowrap;
}
.steo-cls.actual{color:var(--ok); border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.steo-cls.estimate{color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.steo-cls.forecast{color:var(--accent); border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent)}
.steo-detail{display:flex; flex-direction:column; gap:12px}
.steo-block .steo-name{margin:0 0 4px; font:600 11.5px/1.2 var(--sans); color:var(--head)}
.steo-svg .ptf-line.fc{stroke-dasharray:5 4}
.lang-chip{
  font:600 9px/1 var(--sans); letter-spacing:.06em;
  color:var(--muted); border:1px solid var(--border); border-radius:3px; padding:2px 4px;
}
.market-mini{margin-top:0}
.pl-news{display:flex; flex-direction:column; gap:var(--gap-block)}



/* — TASK-024: Enerji 12 kolon kompakt grid — ilk sıra PTF+üretim+endeks ~180px;
   yakıt 3×3 matris; stok+tahmin aynı ilk 900px'te — */
.e-grid{display:grid; grid-template-columns:minmax(0,5fr) minmax(0,4fr) minmax(0,3fr); gap:var(--gap); align-items:stretch}
.e-grid .panel{padding:8px 11px 9px; min-height:0}
.e-grid .panel-head{margin-bottom:4px; padding-bottom:3px}
.e-grid .ptf-svg{max-height:104px}
.e-grid .ptf-curve-meta{margin-top:4px; gap:3px 10px; font-size:10px}
.e-grid .ptf-head-val span{font-size:15px}
.e-grid .ptf-head{margin-bottom:4px}
.e-grid .gen-row{padding:0; font-size:10px; line-height:1.35}
.e-grid .gen-row:nth-child(n+6){display:none}
.e-grid .pb-line{height:7px}
.e-grid .pb-bar{margin:2px 0 5px}
.e-grid .gen-summary{font-size:10.5px; margin:0 0 4px}
.e-grid .gen-list{gap:1px}
.e-grid .ptf-index-svg{max-height:104px}
.e-grid .gen-ie, .e-grid .e-note{display:none}
.e-grid > .panel{display:flex; flex-direction:column}
.fuel-table.detail .fuel-row{grid-template-columns:minmax(0,1fr) auto; padding:3px 2px}
.fuel-table.detail .fuel-label{font-size:11px}
.fuel-table.detail .fuel-value{font-size:13px}
.fuel-table.detail .fuel-when{font-size:10px}
.e-row2{grid-template-columns:minmax(0,1fr) minmax(0,1fr); margin-top:var(--gap); align-items:start}
.e-row2 .stocks-grid{grid-template-columns:1fr 1fr; gap:6px}
.e-row2 .stock-cell{padding:4px 8px 4px}
.e-row2 .stock-value{font-size:13px}
.e-row2 .steo-row{padding:2px 0}
.e-row2 .steo-svg{max-height:64px; margin-top:4px}
@media (max-width:980px){ .e-grid, .e-row2{grid-template-columns:1fr} }

/* yakıt 3×3 matris (Enerji detail 3 sütun; Panel 2 sütun) */
@media (min-width:761px){
  .fuel-table{display:grid; grid-template-columns:1fr 1fr; column-gap:18px}
}
.fuel-table.detail{display:flex; flex-direction:column}
@media (min-width:761px){
  .fuel-table.detail{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2px 16px}
  .fuel-table.detail .fuel-row{border-bottom:1px solid var(--border-soft)}
  .fuel-table.detail .fuel-value small{display:inline; margin-left:3px}
}

/* CBAM / EU ETS ayrı kompakt kutular */
.carbon-duo{display:grid; grid-template-columns:1fr 1fr; gap:var(--gap)}
.carbon-val{font:600 22px/1 var(--sans); color:var(--text); letter-spacing:-.01em}
.carbon-val small{font:500 10.5px var(--sans); color:var(--muted); margin-left:5px}
.carbon-meta{color:var(--faint); font:500 10.5px/1.35 var(--sans); margin-top:4px}
@media (max-width:640px){ .carbon-duo{grid-template-columns:1fr} }
/* — TASK-020: sinyal şeridi + %40/%35/%25 ana ızgara — */
.signals{margin:0}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
.ia-grid{
  display:grid; grid-template-columns:minmax(0,40fr) minmax(0,35fr) minmax(240px,25fr);
  gap:var(--gap-block); align-items:start;
}
.ia-grid.two{grid-template-columns:minmax(0,58fr) minmax(0,42fr)}
@media (max-width:980px){ .ia-grid.two, .ia-grid{grid-template-columns:1fr} }
.ia-left,.ia-mid,.ia-right{display:flex; flex-direction:column; gap:var(--gap); min-width:0}
@media (max-width:1180px){ .ia-grid{grid-template-columns:1fr} }
.exp-top{display:flex; align-items:baseline; gap:8px 12px; flex-wrap:wrap; margin-bottom:4px}
.exp-value{font:600 19px/1 var(--sans); color:var(--text)}
.exp-value small{font:500 10.5px var(--sans); color:var(--muted); margin-left:5px}
.exp-sectors{list-style:none; margin:4px 0 0; padding:0}
.exp-row{display:grid; grid-template-columns:minmax(110px,1fr) auto; gap:4px 10px;
  align-items:baseline; padding:3px 0; border-top:1px solid var(--border-soft)}
/* — Haberler modları (TASK-021): GENEL 3 sütun / EKONOMİK 2 sütun — */
.news-modes{display:flex; gap:4px; margin-bottom:10px}
.news-mode{
  font:600 12.5px/1 var(--sans); color:var(--muted); cursor:pointer;
  background:transparent; border:1px solid var(--border); border-radius:999px; padding:8px 16px;
}
.news-mode[aria-selected="true"]{
  color:var(--head);
  background:color-mix(in srgb,var(--accent) 14%,transparent);
  border-color:color-mix(in srgb,var(--accent) 38%,transparent);
}
.news-cols{display:grid; gap:var(--gap-block); align-items:start; position:relative}
.news-cols.genel{grid-template-columns:repeat(3, minmax(0,1fr))}
.news-cols.genel::before{
  content:''; position:absolute; left:33.33%; top:10px; bottom:10px; width:1px; pointer-events:none;
  background:var(--border-soft);
}
.news-cols.ekonomik{grid-template-columns:repeat(2, minmax(0,1fr))}
.news-cols.ekonomik::before{
  content:''; position:absolute; left:50%; top:10px; bottom:10px; width:1px; pointer-events:none;
  background:var(--border-soft);
}
@media (max-width:980px){
  .news-cols.genel, .news-cols.ekonomik{grid-template-columns:1fr}
  .news-cols.genel::before, .news-cols.ekonomik::before{display:none}
}

/* — /kaynaklar sayfası — */
.kaynak-note{color:var(--muted); font-size:12px; line-height:1.5; margin:0 0 10px; max-width:80ch}
.kaynaklar-list{display:flex; flex-direction:column; gap:5px}
.kyn-row{
  display:grid; grid-template-columns:minmax(240px,380px) 1fr 130px 120px;
  gap:4px 14px; align-items:baseline;
  padding:6px 10px; border:1px solid var(--border-soft); border-radius:6px;
  background:color-mix(in srgb,var(--surface-2) 55%,transparent);
}
.kyn-name{font:600 12px/1.35 var(--sans); color:var(--text); overflow-wrap:anywhere}
.kyn-name a{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent)}
.kyn-name a:hover{border-bottom-style:solid}
.kyn-auth{
  display:inline-block; margin-left:8px; padding:1px 5px;
  color:var(--faint); font-size:9.5px; font-weight:500;
  border:1px solid var(--border-soft); border-radius:3px; vertical-align:1px;
}
.kyn-provides{color:var(--muted); font-size:11.5px; line-height:1.4; overflow-wrap:anywhere}
.kyn-cadence{color:var(--faint); font-size:11px}
.kyn-st{font:700 9.5px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; border-radius:3px; padding:3px 6px; white-space:nowrap; text-align:center}
.kyn-st.ok{color:var(--ok); border:1px solid color-mix(in srgb,var(--ok) 35%,transparent)}
.kyn-st.stale{color:var(--accent); border:1px solid color-mix(in srgb,var(--accent) 40%,transparent)}
.kyn-st.unavailable{color:var(--down); border:1px solid color-mix(in srgb,var(--down) 35%,transparent)}
.kyn-st.anahtar{color:var(--accent); border:1px dashed color-mix(in srgb,var(--accent) 45%,transparent)}
.kyn-st.aday{color:var(--faint); border:1px dashed var(--border)}
@media (max-width:820px){
  .kyn-row{grid-template-columns:1fr auto; }
  .kyn-provides,.kyn-cadence{grid-column:1 / -1}
  .fuel-row,.steo-row{grid-template-columns:1fr auto auto}
  .fuel-when,.fuel-note{grid-column:1 / -1; justify-self:start}
}

/* — footer: ince çizgi + tek satır — */
.foot{
  border-top:1px solid var(--border-soft); padding-top:10px;
  display:flex; align-items:baseline;
  color:var(--muted); font-size:12px;
}
.foot-line{display:flex; align-items:baseline; gap:6px 16px; flex-wrap:wrap; width:100%}
.foot-kaynaklar{color:var(--accent); text-decoration:none; border-bottom:1px dotted color-mix(in srgb,var(--accent) 55%,transparent)}
.foot-kaynaklar:hover{border-bottom-style:solid}
.foot-when{margin-left:auto; color:var(--faint)}
/* — mobil — */
@media (max-width:640px){
  body{padding:8px 10px 12px; font-size:13px}
  .panel{padding:12px 12px 13px}
  .panel-head{flex-wrap:wrap}
  .hide-sm{display:none!important}
  .topstrip{position:static; flex-wrap:wrap}
  .ts-left{width:100%; justify-content:space-between}
  .ts-right{width:100%; justify-content:space-between; margin-left:0}
  .hide-xs{display:none!important}
  .wx-chip{max-width:200px}
  .wx-popover{width:min(320px, calc(100vw - 20px)); right:auto; left:50%; transform:translateX(-50%); position:fixed; top:120px}
  .city-popover{max-height:280px}
  .inv-row{grid-template-columns:1fr; gap:2px 0}
}
@media (min-width:1600px){
  body{max-width:min(1960px, calc(100vw - 40px))}
}
.duo .panel{padding:8px 11px 9px}
.ia-grid.two .duo{align-items:start}
#view-panel #gen-mix .gen-row:nth-child(n+6){display:none}
#view-panel #gen-mix .gen-ie,
#view-panel #gen-mix .e-note{display:none}
#view-panel .stocks-grid{grid-template-columns:1fr 1fr; gap:6px}
#view-panel .stock-cell{padding:5px 8px 4px}
#view-panel .stock-value{font-size:15px}
#view-panel .carbon-val{font-size:18px}
#view-panel .exp-sectors{margin:2px 0 0}
.ptf-head-val span{font-size:18px}
.ptf-svg{max-height:150px}
.gen-row{padding:1px 0; font-size:11px}
.pb-line{height:9px}
.official-item{padding:4px 2px}
.news-item{padding:4px 2px}
.dev-chip{padding:5px 9px 4px}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important; transition:none!important}
}

/* — TASK-026: Enerji beş alt araç (Helios Enerji Monitörü düzeni) — yeni görsel dil
   icat edilmez: sekmeler panel kutusudur (surface + border + radius-m); seçili sekme
   tek vurgu rengi bakırla işaretlenir. Grafikler ptf-* sınıflarını kullanır. — */
.etabs{display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--gap)}  /* TASK-028: üç alt araç */
.etab{
  display:flex; align-items:center; gap:10px; min-width:0; text-align:left; cursor:pointer;
  font:inherit; color:var(--text); -webkit-appearance:none; appearance:none;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m);
  padding:9px 12px;
}
.etab:hover{border-color:color-mix(in srgb,var(--accent) 35%,var(--border))}
.etab:focus-visible{outline:2px solid var(--accent); outline-offset:2px}
.etab-ic{
  flex:none; display:grid; place-items:center; width:30px; height:30px;
  border-radius:var(--radius-s); border:1px solid var(--border-soft); background:var(--surface-2); color:var(--muted);
}
.etab-txt{display:flex; flex-direction:column; gap:3px; min-width:0}
.etab-title{font:600 12.5px/1.2 var(--sans); color:var(--head); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.etab-sub{font:500 10.5px/1.2 var(--sans); color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.etab[aria-selected="true"]{
  background:color-mix(in srgb,var(--accent) 9%,var(--surface));
  border-color:color-mix(in srgb,var(--accent) 50%,transparent);
}
.etab[aria-selected="true"] .etab-ic{
  color:var(--accent); background:color-mix(in srgb,var(--accent) 12%,transparent);
  border-color:color-mix(in srgb,var(--accent) 40%,transparent);
}
.etab[aria-selected="true"] .etab-title{color:var(--accent)}
.epane{display:flex; flex-direction:column; gap:var(--gap)}
.epane[hidden]{display:none}
.epane .e-row2{margin-top:0}
.carbon-duo.trio{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (max-width:760px){ .carbon-duo.trio{grid-template-columns:1fr} }
@media (max-width:640px){
  .etab{padding:8px 9px; gap:8px}
  .etab-sub{display:none}
  .etab-ic{display:none}                       /* TASK-028: üç sekme tek satırda; başlık iki satıra kırılabilir */
  .etab-title{white-space:normal; overflow-wrap:anywhere}
}

/* grafik öğeleri: yenilenebilir/ücretsiz = bakır; diğer/açık artırma = soluk bakır;
   ön değer/eksik rapor = saydam; karşılaştırma çizgisi kesikli metin rengi */
.bar-a{fill:var(--accent)}
.bar-b{fill:color-mix(in srgb,var(--accent) 36%,var(--surface-2))}
.bar-dim{opacity:.38}
.ref-line{fill:none; stroke:color-mix(in srgb,var(--text) 42%,transparent); stroke-width:1.2; stroke-dasharray:3 3}
.dot-hollow{fill:var(--surface); stroke:var(--accent); stroke-width:1.4}
.lg{display:inline-flex; align-items:center; gap:4px}
.lg i{display:inline-block; width:9px; height:9px; border-radius:2px}
.lg-a{background:var(--accent)}
.lg-b{background:color-mix(in srgb,var(--accent) 36%,var(--surface-2))}
.lg-dim{background:var(--accent); opacity:.38}
.lg-ref{height:0!important; width:12px!important; border-top:1.5px dashed color-mix(in srgb,var(--text) 45%,transparent); border-radius:0!important}

/* AB ETS sektör tablosu: iki sütun; sayılar sabit sütunlarda sağa hizalı */
.ets-sectors{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:18px}
.ets-row{
  display:grid; grid-template-columns:minmax(0,1fr) 4.4em 4.4em 5em; gap:2px 10px; align-items:baseline;
  padding:3px 2px; border-bottom:1px solid var(--border-soft); font:500 11.5px/1.3 var(--sans);
}
.ets-row > span:not(.ets-name){text-align:right; font-weight:600; color:var(--text)}
.ets-row.head{color:var(--faint); font-size:10px; letter-spacing:.04em}
.ets-row.head > span{font-weight:500!important; color:var(--faint)!important}
.ets-name{color:var(--text); min-width:0; overflow-wrap:anywhere}
.ets-name .news-kind{margin-left:4px; vertical-align:1px}
@media (max-width:760px){ .ets-sectors{grid-template-columns:1fr} .ets-sectors .ets-row.head + .ets-row.head{display:none} }

/* yakıt satırı hizası (kullanıcı QA 2026-09-29): değer · birim · [trend] · tarih sabit
   sütunlarda — satırlar ayrı ızgara olsa da sütunlar üst üste hizalanır */
.fuel-row, .fuel-table.detail .fuel-row{
  grid-template-columns:minmax(0,1fr) 4.4em 5.2em 5.4em; gap:2px 8px; align-items:baseline;
}
.fuel-table.detail .fuel-row{grid-template-columns:minmax(0,1fr) 4.4em 5.2em 56px 5.4em}
.fuel-label{min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.fuel-label .fuel-geo{display:inline; margin-left:5px}
.fuel-value, .fuel-table.detail .fuel-value{grid-column:auto; justify-self:end; text-align:right; white-space:nowrap}
.fuel-unit{font:500 10px/1 var(--sans); color:var(--muted); white-space:nowrap}
.fuel-when, .fuel-table.detail .fuel-when{grid-column:auto; justify-self:end; text-align:right}
.fuel-table.detail .m-spark{justify-self:center}
@media (min-width:761px) and (max-width:1180px){
  .fuel-table.detail{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:640px){
  .fuel-row, .fuel-table.detail .fuel-row{grid-template-columns:minmax(0,1fr) 4.4em 5.2em 4.6em}
  .fuel-table.detail .m-spark, .fuel-table.detail .fuel-row > span:empty{display:none}
  .fuel-label .fuel-geo{display:block; margin-left:0}
  .fuel-label{white-space:normal}
}
/* sıkı ızgarada (e-grid 3fr sütunu ~220px) karma satırı taşmasın */
.e-grid .gen-row{grid-template-columns:minmax(0,1fr) 40px 78px; gap:2px 8px}
.e-grid .gen-name{min-width:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
/* STEO satırı: yakıt satırıyla aynı sabit sütunlar (ad · değer · birim · sınıf · dönem) */
.steo-row{grid-template-columns:minmax(0,1fr) 4.4em 5.6em 6.4em 4.6em; gap:2px 8px}
.steo-row .steo-cls{justify-self:start}
@media (max-width:640px){ .steo-row{grid-template-columns:minmax(0,1fr) 4.4em 5.6em} .steo-row .steo-cls, .steo-row .fuel-when{grid-column:auto} }

/* — TASK-029: ABD borsası kartları (m-card dili; 3 aylık gerçek kapanış grafiği) — */
.us-grid{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:var(--gap)}
.us-card{display:flex; flex-direction:column; gap:5px; min-width:0; padding:9px 11px 8px;
  background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-m)}
.us-card.off{border-style:dashed; background:color-mix(in srgb,var(--surface) 55%,transparent)}
.us-head{display:flex; align-items:center; justify-content:space-between; gap:6px}
.us-label{color:var(--muted); font:600 11px/1.25 var(--sans); letter-spacing:.02em; overflow-wrap:anywhere; min-width:0}
.us-kind{flex:none; font:600 9px/1 var(--sans); letter-spacing:.06em; text-transform:uppercase; color:var(--muted);
  border:1px solid var(--border); border-radius:4px; padding:2px 4px}
.us-svg{width:100%; height:64px; display:block; overflow:visible}
.us-line{fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke}
.us-area{stroke:none; opacity:.10}
.us-svg.up .us-line{stroke:var(--ok)} .us-svg.up .us-area{fill:var(--ok)}
.us-svg.down .us-line{stroke:var(--down)} .us-svg.down .us-area{fill:var(--down)}
.us-foot{display:flex; justify-content:space-between; align-items:center; gap:6px; font:500 10px/1 var(--sans); color:var(--muted)}
.us-3m{font-weight:600} .us-3m.up{color:var(--ok)} .us-3m.down{color:var(--down)}
@media (max-width:1180px){ .us-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
@media (max-width:760px){ .us-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:400px){ .us-grid{grid-template-columns:1fr} }

/* TASK-031: Finans sekme kapları da kutular arası aynı boşluğu taşır */
#fp-tr, #fp-abd{display:flex; flex-direction:column; gap:var(--gap)}
#fp-tr[hidden], #fp-abd[hidden]{display:none}

/* TASK-031: yan yana kutular aynı boyda (boş şerit kalmaz) */
#view-panel .duo, #view-panel .carbon-duo{align-items:stretch}
#view-panel .duo > .panel, #view-panel .carbon-duo > .panel{height:100%}

/* TASK-033: üst şeritte kompakt piyasa özeti (menü ile saat arasındaki boşluk) */
.ts-market{display:flex; align-items:center; gap:4px 16px; margin-left:auto; min-width:0; flex-wrap:wrap; justify-content:flex-end}
.ts-market + .ts-right{margin-left:16px}
.tsm{display:inline-flex; align-items:baseline; gap:6px; white-space:nowrap; font:500 11px/1.2 var(--sans); color:var(--muted)}
.tsm-l{font-weight:600; letter-spacing:.02em}
.tsm-v{font:600 12.5px/1.2 var(--sans); color:var(--head)}
.tsm-d{font:600 10.5px/1 var(--sans)} .tsm-d.up{color:var(--ok)} .tsm-d.down{color:var(--down)}
.tsm-s{font:600 9px/1 var(--sans); text-transform:uppercase; letter-spacing:.05em; color:var(--warn,var(--accent))}
.tsm.off .tsm-v{color:var(--faint)}
@media (max-width:1080px){ .ts-market{order:5; flex-basis:100%; justify-content:flex-start; margin-left:0; padding-top:4px; border-top:1px solid var(--border-soft)} .ts-market + .ts-right{margin-left:auto} }