/* Denge Masası — yer istasyonu estetiği.
   Ekran bir yayın sayfası değil, bir ölçüm panosu gibi davranır: ince hatlar,
   sabit genişlikli sayılar, kehribar gösterge rengi, koyu zemin. Tez metni
   tek başına serif — ölçülen ile varsayılan arasındaki fark tipografiyle de
   görünsün diye. */

@font-face{font-family:'Plex';font-style:normal;font-weight:400;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-400-normal-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:'Plex';font-style:normal;font-weight:400;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-400-normal-latin.woff2) format('woff2');}
@font-face{font-family:'Plex';font-style:normal;font-weight:500;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-500-normal-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:'Plex';font-style:normal;font-weight:500;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-500-normal-latin.woff2) format('woff2');}
@font-face{font-family:'Plex';font-style:normal;font-weight:600;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-600-normal-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:'Plex';font-style:normal;font-weight:600;font-display:swap;
 src:url(vendor/fonts/IBMPlexMono-600-normal-latin.woff2) format('woff2');}
@font-face{font-family:'Spec';font-style:normal;font-weight:400;font-display:swap;
 src:url(vendor/fonts/Spectral-400-normal-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:'Spec';font-style:normal;font-weight:400;font-display:swap;
 src:url(vendor/fonts/Spectral-400-normal-latin.woff2) format('woff2');}
@font-face{font-family:'Spec';font-style:normal;font-weight:600;font-display:swap;
 src:url(vendor/fonts/Spectral-600-normal-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:'Spec';font-style:normal;font-weight:600;font-display:swap;
 src:url(vendor/fonts/Spectral-600-normal-latin.woff2) format('woff2');}
@font-face{font-family:'Spec';font-style:italic;font-weight:400;font-display:swap;
 src:url(vendor/fonts/Spectral-400-italic-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:'Spec';font-style:italic;font-weight:400;font-display:swap;
 src:url(vendor/fonts/Spectral-400-italic-latin.woff2) format('woff2');}

:root{
  --siyah:#05080a; --zemin:#080c0f; --panel:rgba(180,215,220,.028);
  --hat:rgba(170,205,212,.115); --hat-parlak:rgba(170,205,212,.26);
  --metin:#b9c7cb; --sonuk:#63757c; --beyaz:#e8f0f2;
  --kehribar:#d9a244; --kirmizi:#c8512c; --yesil:#3f9187; --mavi:#5b8ca8;
  --ust:46px; --ray:270px; --panel-g:330px; --alt:34px;
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{
  background:var(--siyah); color:var(--metin);
  font-family:'Plex',ui-monospace,monospace; font-size:12px; line-height:1.5;
  overflow:hidden; -webkit-font-smoothing:antialiased;
}
/* ölçüm kâğıdı dokusu + film grenі */
body::before{
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:
    repeating-linear-gradient(0deg,transparent 0 39px,rgba(170,205,212,.028) 39px 40px),
    repeating-linear-gradient(90deg,transparent 0 39px,rgba(170,205,212,.028) 39px 40px),
    radial-gradient(120% 90% at 50% 42%,rgba(30,60,70,.30),transparent 70%);
}
body::after{
  content:''; position:fixed; inset:0; z-index:60; pointer-events:none; opacity:.32;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
  mix-blend-mode:overlay;
}

/* ── iskelet ─────────────────────────────────────────────── */
#kabuk{position:relative;z-index:2;height:100%;display:grid;
  grid-template-rows:var(--ust) 1fr var(--alt);
  grid-template-columns:var(--ray) 1fr var(--panel-g);
  grid-template-areas:"ust ust ust" "ray sahne panel" "alt alt alt";}

/* Altyazı ve efsane, masaüstünde kürenin ÜSTÜNE biner (aynı grid alanı),
   mobilde kürenin ALTINA iner (kendi satırı). Aynı işaretleme, iki düzen —
   ikisi için ayrı DOM tutmak, birini güncelleyip diğerini unutmak demek. */
#bilgi{grid-area:sahne;align-self:end;justify-self:stretch;z-index:3;
  pointer-events:none;display:flex;justify-content:space-between;
  align-items:flex-end;gap:20px;padding:0 16px 14px}
#bilgi>*{pointer-events:auto}
#gostergeler.serit{display:flex;gap:20px;flex-wrap:wrap;align-items:center}

.cerceve{border:1px solid var(--hat);background:linear-gradient(180deg,var(--panel),transparent 60%);}

/* ── üst şerit ───────────────────────────────────────────── */
#ust{grid-area:ust;display:flex;align-items:center;gap:22px;padding:0 16px;
  border-bottom:1px solid var(--hat);background:rgba(5,8,10,.82);backdrop-filter:blur(6px);}
#marka{font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--beyaz);font-size:12.5px;white-space:nowrap}
#marka b{color:var(--kehribar);font-weight:600}
.gosterge{display:flex;align-items:baseline;gap:7px;white-space:nowrap}
.gosterge .et{color:var(--sonuk);text-transform:uppercase;letter-spacing:.13em;font-size:9.5px}
.gosterge .dg{font-size:15px;font-weight:600;color:var(--beyaz);font-variant-numeric:tabular-nums}
.gosterge .dg.uyari{color:var(--kirmizi)}
.gosterge .dg.iyi{color:var(--yesil)}
#ust .sag{margin-left:auto;display:flex;gap:18px;align-items:center;color:var(--sonuk);font-size:10px}
#ust a{color:var(--sonuk);text-decoration:none;border-bottom:1px solid transparent;letter-spacing:.1em;text-transform:uppercase}
#ust a:hover{color:var(--kehribar);border-color:var(--kehribar)}

/* ── sol ray ─────────────────────────────────────────────── */
#ray{grid-area:ray;border-right:1px solid var(--hat);overflow-y:auto;padding:12px 0 20px}
.baslik{padding:12px 14px 7px;color:var(--sonuk);text-transform:uppercase;
  letter-spacing:.17em;font-size:9.5px;display:flex;justify-content:space-between;align-items:center}
.baslik span{color:var(--hat-parlak)}
.satir{padding:7px 14px;cursor:pointer;border-left:2px solid transparent;position:relative;transition:background .14s,border-color .14s}
.satir:hover{background:rgba(217,162,68,.055);border-left-color:rgba(217,162,68,.5)}
.satir.secili{background:rgba(217,162,68,.1);border-left-color:var(--kehribar)}
.satir .ad{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.satir .ad b{font-weight:500;color:var(--beyaz);font-size:11.5px}
.satir .ad em{font-style:normal;color:var(--sonuk);font-size:10px;font-variant-numeric:tabular-nums}
.cubuk{height:3px;margin-top:5px;background:rgba(170,205,212,.09);position:relative;overflow:hidden}
.cubuk i{position:absolute;left:0;top:0;bottom:0;background:var(--kehribar);
  transform-origin:left;animation:ac .7s cubic-bezier(.2,.8,.2,1) both}
.cubuk i.kir{background:var(--kirmizi)}
@keyframes ac{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.rozet{display:inline-block;padding:0 4px;border:1px solid;font-size:8.5px;
  letter-spacing:.1em;text-transform:uppercase;vertical-align:1px}
.rozet.olculen{color:var(--kehribar);border-color:rgba(217,162,68,.45)}
.rozet.tez{color:var(--sonuk);border-color:var(--hat)}
.rozet.kir{color:var(--kirmizi);border-color:rgba(200,81,44,.5)}

/* ── sahne ───────────────────────────────────────────────── */
#sahne{grid-area:sahne;position:relative;overflow:hidden}
/* DİKKAT: <canvas> "yerine geçen" (replaced) bir öğedir. inset:0 vermek
   YETMEZ — genişlik/yükseklik auto kalırsa kutu kapsayıcıya değil öğenin
   DOĞAL boyutuna, yani çizim tamponuna oturur. Yüksek piksel yoğunluklu
   ekranlarda tampon CSS boyutunun iki katıdır ve küre iki kat büyük
   çizilip sol üst köşesinden kırpılır. Masaüstünde (dpr=1) görünmez,
   telefonda (dpr=2) her şeyi bozar. */
#tuval{position:absolute;inset:0;display:block;width:100%;height:100%}
#ipucu{position:absolute;pointer-events:none;padding:5px 9px;background:rgba(5,8,10,.94);
  border:1px solid var(--hat-parlak);font-size:10.5px;color:var(--beyaz);white-space:nowrap;
  opacity:0;transition:opacity .12s;z-index:5;letter-spacing:.04em}
#ipucu.gorunur{opacity:1}
/* köşe nişan işaretleri */
.nisan{position:absolute;width:13px;height:13px;pointer-events:none;opacity:.45}
.nisan::before,.nisan::after{content:'';position:absolute;background:var(--hat-parlak)}
.nisan::before{left:0;top:6px;width:13px;height:1px}
.nisan::after{left:6px;top:0;width:1px;height:13px}
.nisan.su{left:12px;top:12px}.nisan.sa{right:12px;top:12px}
.nisan.au{left:12px;bottom:12px}.nisan.aa{right:12px;bottom:12px}
#altyazi{max-width:430px;font-size:10px;color:var(--sonuk);line-height:1.7}
#altyazi b{color:var(--metin);font-weight:500}
#efsane{font-size:9.5px;color:var(--sonuk);line-height:1.85}
#efsane i{display:inline-block;width:7px;height:7px;margin-right:5px;vertical-align:0}

/* ── sağ panel ───────────────────────────────────────────── */
#panel{grid-area:panel;border-left:1px solid var(--hat);overflow-y:auto;padding-bottom:24px}
#panel h2{font-size:16px;font-weight:600;color:var(--beyaz);letter-spacing:.02em;font-family:'Spec',Georgia,serif}
#panel .kap{padding:14px 16px;border-bottom:1px solid var(--hat)}
.olcum{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1px;background:var(--hat);margin-top:12px}
.olcum div{background:var(--zemin);padding:8px 9px}
.olcum .e{color:var(--sonuk);font-size:9px;text-transform:uppercase;letter-spacing:.12em}
.olcum .v{font-size:17px;color:var(--beyaz);font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px}
.aciklama{font-family:'Spec',Georgia,serif;font-size:13px;line-height:1.62;color:var(--metin)}
.aciklama em{color:var(--sonuk)}
.alan-satir{display:flex;align-items:center;gap:8px;margin:5px 0;font-size:10.5px}
.alan-satir .ad{width:104px;color:var(--sonuk);text-transform:uppercase;letter-spacing:.07em;font-size:9px}
.alan-satir .bar{flex:1;height:6px;background:rgba(170,205,212,.08)}
.alan-satir .bar i{display:block;height:100%;background:var(--mavi)}
.alan-satir .sy{width:38px;text-align:right;font-variant-numeric:tabular-nums;color:var(--metin)}
.belge{padding:8px 0;border-top:1px solid var(--hat)}
.belge a{color:var(--metin);text-decoration:none;display:block;font-size:11px;line-height:1.45}
.belge a:hover{color:var(--kehribar)}
.belge .ust{display:flex;gap:8px;color:var(--sonuk);font-size:9px;text-transform:uppercase;letter-spacing:.1em;margin-bottom:3px}
.belge .ust b{color:var(--kehribar);font-weight:500}

/* ── alt şerit ───────────────────────────────────────────── */
#alt{grid-area:alt;border-top:1px solid var(--hat);display:flex;align-items:center;
  overflow:hidden;background:rgba(5,8,10,.8);gap:0}
#alt .etiket{flex:0 0 auto;padding:0 12px;height:100%;display:flex;align-items:center;
  border-right:1px solid var(--hat);color:var(--kehribar);text-transform:uppercase;
  letter-spacing:.17em;font-size:9px;background:rgba(217,162,68,.06)}
#kayan{flex:1;overflow:hidden;white-space:nowrap;position:relative}
#kayan .ic{display:inline-block;padding-left:100%;animation:kay 130s linear infinite}
#kayan:hover .ic{animation-play-state:paused}
@keyframes kay{from{transform:translateX(0)}to{transform:translateX(-100%)}}
#kayan a{color:var(--metin);text-decoration:none;font-size:10.5px;margin-right:34px}
#kayan a:hover{color:var(--kehribar)}
#kayan a s{color:var(--kehribar);text-decoration:none;margin-right:7px;font-size:9px;
  text-transform:uppercase;letter-spacing:.1em}

/* ── yükleniyor ──────────────────────────────────────────── */
#yukleniyor{position:fixed;inset:0;z-index:80;background:var(--siyah);display:grid;
  place-items:center;transition:opacity .5s;gap:0}
#yukleniyor.bitti{opacity:0;pointer-events:none}
#yukleniyor .ic{text-align:center}
#yukleniyor .t{letter-spacing:.34em;text-transform:uppercase;color:var(--beyaz);font-size:13px;font-weight:600}
#yukleniyor .d{margin-top:9px;color:var(--sonuk);font-size:10px;letter-spacing:.12em}
#yukleniyor .cz{margin-top:16px;width:190px;height:1px;background:var(--hat);overflow:hidden}
#yukleniyor .cz i{display:block;height:100%;width:38%;background:var(--kehribar);animation:tara 1.1s ease-in-out infinite}
@keyframes tara{0%{transform:translateX(-110%)}100%{transform:translateX(300%)}}

/* açılış sahnelemesi */
#ust,#ray,#panel,#alt{animation:bel .55s ease both}
#ray{animation-delay:.06s}#panel{animation-delay:.12s}#alt{animation-delay:.18s}
@keyframes bel{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}

::-webkit-scrollbar{width:7px;height:7px}
::-webkit-scrollbar-track{background:transparent}
::-webkit-scrollbar-thumb{background:rgba(170,205,212,.16)}
::-webkit-scrollbar-thumb:hover{background:rgba(217,162,68,.4)}

/* ── dar ekran ───────────────────────────────────────────── */
@media (max-width:1100px){
  :root{--ray:210px;--panel-g:260px}
  #efsane{display:none}
}
/* ═══════════════════════════════════════════════════════════════════
   Mobil — masaüstü düzeninin sıkıştırılmışı değil, kendi düzeni.

   Üç kural:
   1) Küre üstte ve büyük kalır; ürünün kendisi o.
   2) Denetimler (pencere · arama · tarih) kürenin hemen altında ve
      YAPIŞIK durur — sayfayı kaydırınca kaybolmazlar.
   3) Efsane küreyi kapatmaz: yatay kaydırılan bir şerit olur.
   ═══════════════════════════════════════════════════════════════════ */
@media (max-width:820px){
  :root{--ust:auto; --alt:30px}
  body{overflow:auto;-webkit-text-size-adjust:100%}
  #kabuk{height:auto;grid-template-columns:1fr;
    grid-template-rows:auto 54vh auto auto auto auto;
    grid-template-areas:"ust" "sahne" "bilgi" "ray" "panel" "alt";}
  #bilgi{grid-area:bilgi;align-self:auto;flex-direction:column;align-items:stretch;
    gap:10px;padding:11px 12px 2px;border-top:1px solid var(--hat)}
  #gostergeler.serit{flex-wrap:nowrap}

  /* üst şerit: marka + dil sabit, göstergeler yatay kaydırılır */
  #ust{height:auto;padding:8px 12px;gap:10px;flex-wrap:nowrap;align-items:center}
  #marka{font-size:11px;letter-spacing:.16em}
  #gostergeler{overflow-x:auto;overflow-y:hidden;gap:14px !important;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  #gostergeler::-webkit-scrollbar{display:none}
  #gostergeler .gosterge{display:flex !important}     /* masaüstündeki gizlemeyi geri al */
  #gostergeler .gosterge .dg{font-size:13px}
  #ust .sag{gap:10px}
  #ust .sag #zaman,#ust .sag a{display:none}          /* yer yok; alt bölümlerde var */
  #ust .sag button[data-gorunum]{font-size:9px}

  /* küre */
  #sahne{min-height:300px}
  .nisan{display:none}
  #altyazi{max-width:none;font-size:10.5px}

  /* efsane: kürenin altında yatay şerit */
  /* Efsane mobilde kaydırılmaz, SARAR: yatay kaydırma çubuğu görünmediği
     için kullanıcı sağda içerik olduğunu anlamıyor ve arketiplerin yarısını
     hiç görmüyordu. */
  #efsane{max-width:none;display:block}
  .efsane-ark{flex-wrap:wrap;gap:4px 12px}
  .efsane-blok+.efsane-blok{margin-top:8px;padding-top:7px;
    border-top:1px solid var(--hat);border-left:0;padding-left:0}
  #bilgi{padding-bottom:10px}
  #efsane::-webkit-scrollbar{display:none}
  .efsane-blok+.efsane-blok{margin-top:0;padding-top:0;border-top:0;
    border-left:1px solid var(--hat);padding-left:14px}
  .efsane-blok{flex:0 0 auto}
  .efsane-ark{flex-wrap:nowrap}

  /* denetimler yapışık */
  #ray{padding-top:0}
  #ray-ust{position:sticky;top:0;padding:10px 12px 11px}
  .pencere button{padding:8px 0;font-size:10px}       /* dokunma hedefi */
  .ara input{padding:8px 8px 8px 24px;font-size:12px}
  #zaman-kaydirici{height:16px;background:transparent}
  #zaman-kaydirici::-webkit-slider-thumb{width:16px;height:16px}
  #zaman-kaydirici::-moz-range-thumb{width:16px;height:16px}
  #zaman-kutu{position:relative}
  #zaman-kutu::before{content:'';position:absolute;left:0;right:0;top:30px;height:3px;
    background:rgba(170,205,212,.16);pointer-events:none}

  .satir{padding:10px 12px}
  .baslik{padding:12px 12px 7px}
  #panel .kap{padding:14px 12px}
  #panel h2{font-size:18px}
  .olcum{grid-template-columns:1fr 1fr 1fr}
  .delta-buyuk{font-size:26px}

  /* alt şerit ince */
  #alt .etiket{padding:0 10px;font-size:8.5px;letter-spacing:.12em}
  #kayan a{font-size:10px}
}

/* Çok dar ekran: üç sütunluk sayı kutuları ikiye düşer */
@media (max-width:400px){
  .olcum{grid-template-columns:1fr 1fr}
  .metrik{grid-template-columns:1fr}
  #marka{font-size:10px}
}

/* Yatay tutulan telefon: küre yüksekliği ekranı yemesin */
@media (max-width:900px) and (orientation:landscape){
  #kabuk{grid-template-rows:auto 78vh auto auto auto}
}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ═══════════════════════════════════════════════════════════════════
   v2 — Δ katmanı, belge detayı, sistem panosu
   ═══════════════════════════════════════════════════════════════════ */

/* ── sol ray denetimleri ─────────────────────────────────────────── */
#ray-ust{position:sticky;top:0;z-index:3;background:rgba(5,8,10,.96);
  border-bottom:1px solid var(--hat);padding:9px 12px 10px;backdrop-filter:blur(6px)}
.pencere{display:flex;gap:1px;background:var(--hat);border:1px solid var(--hat)}
.pencere button{flex:1;background:var(--zemin);border:0;color:var(--sonuk);
  font:inherit;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
  padding:5px 0;cursor:pointer;transition:background .13s,color .13s}
.pencere button:hover{color:var(--metin);background:rgba(217,162,68,.07)}
.pencere button[aria-pressed="true"]{background:rgba(217,162,68,.14);color:var(--kehribar)}
.ara{margin-top:8px;position:relative}
.ara input{width:100%;background:var(--zemin);border:1px solid var(--hat);
  color:var(--metin);font:inherit;font-size:11px;padding:5px 8px 5px 24px;outline:none}
.ara input:focus{border-color:rgba(217,162,68,.55)}
.ara input::placeholder{color:var(--sonuk)}
.ara::before{content:'⌕';position:absolute;left:8px;top:3px;color:var(--sonuk);font-size:13px}

/* ── Δ göstergesi ────────────────────────────────────────────────── */
.delta-kutu{border:1px solid var(--hat);background:linear-gradient(180deg,var(--panel),transparent);
  padding:12px 13px;margin-top:12px}
.delta-ust{display:flex;justify-content:space-between;align-items:baseline}
.delta-et{color:var(--sonuk);font-size:9px;text-transform:uppercase;letter-spacing:.15em}
.delta-buyuk{font-size:30px;font-weight:600;font-variant-numeric:tabular-nums;line-height:1.1;
  letter-spacing:-.02em}
.delta-buyuk.arti{color:var(--kirmizi)}
.delta-buyuk.eksi{color:var(--yesil)}
.delta-buyuk.notr{color:var(--sonuk)}
/* Hakem bandı — Δ'nın hata payı. Sayının ALTINDA değil, yanında durur:
   ayrı bir kutuya alınırsa okunmaz, ve okunmayan hata payı yok demektir. */
.hakem-bant{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;
  margin-top:4px;font-size:9.5px;letter-spacing:.05em;color:var(--sonuk);
  font-variant-numeric:tabular-nums}
.hakem-bant b{color:var(--kehribar);letter-spacing:.12em;font-size:9px}
.hakem-bant.kararsiz{color:var(--kehribar)}
.hakem-kutu{border:1px solid var(--kehribar);border-left-width:3px;
  background:rgba(212,160,74,.06);padding:10px 12px;margin-top:12px;
  font-size:10px;line-height:1.65;color:var(--metin)}
.hakem-kutu b{color:var(--kehribar)}
.hakem-satir{display:flex;justify-content:space-between;gap:10px;margin-top:5px;
  font-variant-numeric:tabular-nums}
.hakem-satir .e{color:var(--sonuk);text-transform:uppercase;letter-spacing:.1em;font-size:9px}

.kr-satir{display:flex;align-items:center;gap:8px;margin-top:7px;font-size:10px}
.kr-satir .e{width:74px;color:var(--sonuk);text-transform:uppercase;letter-spacing:.1em;font-size:9px}
.kr-satir .bar{flex:1;height:7px;background:rgba(170,205,212,.08);position:relative}
.kr-satir .bar i{position:absolute;left:0;top:0;bottom:0;background:var(--mavi)}
.kr-satir .bar i.r{background:var(--kehribar)}
.kr-satir .sy{width:44px;text-align:right;font-variant-numeric:tabular-nums;color:var(--beyaz)}
.delta-not{margin-top:9px;font-size:10px;color:var(--sonuk);line-height:1.6}

/* diverging bar: alan bazında Δ katkısı */
.dv{display:flex;align-items:center;gap:7px;margin:4px 0;font-size:10px}
.dv .ad{width:96px;color:var(--sonuk);text-transform:uppercase;letter-spacing:.07em;font-size:9px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dv .eksen{flex:1;height:9px;position:relative;background:rgba(170,205,212,.06)}
.dv .eksen::before{content:'';position:absolute;left:50%;top:-1px;bottom:-1px;width:1px;background:var(--hat-parlak)}
.dv .eksen i{position:absolute;top:1px;bottom:1px}
.dv .sy{width:42px;text-align:right;font-variant-numeric:tabular-nums;color:var(--metin)}

/* ── sparkline ───────────────────────────────────────────────────── */
.kivilcim{display:block;width:100%;height:34px;margin-top:8px;overflow:visible}
.kivilcim .sifir{stroke:var(--hat-parlak);stroke-width:1;stroke-dasharray:2 3}

/* ── kaynak sağlık takvimi ───────────────────────────────────────── */
.takvim{display:flex;gap:2px;margin-top:7px;flex-wrap:wrap}
.takvim i{width:11px;height:11px;display:block;background:rgba(170,205,212,.12);
  position:relative;cursor:default}
.takvim i.ok{background:var(--yesil)}
.takvim i.bos_beklenen{background:rgba(170,205,212,.18)}
.takvim i.ALARM,.takvim i.hata{background:var(--kirmizi)}

/* ── rozet varyantları ───────────────────────────────────────────── */
.rozet.altin{color:#e2c275;border-color:rgba(226,194,117,.5)}
.rozet.destekliyor{color:var(--yesil);border-color:rgba(63,145,135,.55)}
.rozet.celisiyor{color:var(--kirmizi);border-color:rgba(200,81,44,.6)}
.rozet.notr{color:var(--sonuk);border-color:var(--hat)}
.rozet.ilgisiz{color:var(--sonuk);border-color:var(--hat);opacity:.8}

/* ── belge kartı / detay ─────────────────────────────────────────── */
.belge{cursor:pointer;transition:background .13s;padding-left:6px;margin-left:-6px}
.belge:hover{background:rgba(217,162,68,.055)}
.belge .kr{margin-left:auto;font-variant-numeric:tabular-nums}
.geri{display:inline-flex;align-items:center;gap:6px;color:var(--kehribar);
  background:none;border:0;font:inherit;font-size:9.5px;letter-spacing:.14em;
  text-transform:uppercase;cursor:pointer;padding:0}
.geri:hover{text-decoration:underline}
.terim{display:inline-block;border:1px solid var(--hat);padding:1px 5px;margin:2px 3px 2px 0;
  font-size:9.5px;color:var(--metin)}
.terim.neg{color:var(--kirmizi);border-color:rgba(200,81,44,.4)}
.terim b{color:var(--sonuk);font-weight:400;margin-left:4px}
.gerekce{font-family:'Spec',Georgia,serif;font-size:13px;line-height:1.6;color:var(--metin);
  border-left:2px solid rgba(217,162,68,.5);padding-left:11px;margin-top:9px}

/* ── sistem panosu ───────────────────────────────────────────────── */
.sis-tablo{width:100%;border-collapse:collapse;font-size:10.5px;margin-top:8px}
.sis-tablo th{text-align:left;color:var(--sonuk);font-weight:500;font-size:9px;
  text-transform:uppercase;letter-spacing:.11em;padding:4px 6px 4px 0;border-bottom:1px solid var(--hat)}
.sis-tablo td{padding:6px 6px 6px 0;border-bottom:1px solid var(--hat);vertical-align:top}
.sis-tablo td b{color:var(--beyaz);font-weight:500}
.metrik{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--hat);margin-top:10px}
.metrik div{background:var(--zemin);padding:8px 9px}
.metrik .e{color:var(--sonuk);font-size:9px;text-transform:uppercase;letter-spacing:.11em}
.metrik .v{font-size:18px;color:var(--beyaz);font-weight:600;font-variant-numeric:tabular-nums;margin-top:2px}

#ust .sag button{background:none;border:0;color:var(--sonuk);font:inherit;font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;cursor:pointer;padding:0;
  border-bottom:1px solid transparent}
#ust .sag button:hover,#ust .sag button[aria-pressed="true"]{color:var(--kehribar);border-color:var(--kehribar)}

/* ── odak görünürlüğü (klavye) ───────────────────────────────────── */
:focus-visible{outline:1px solid var(--kehribar);outline-offset:2px}
.satir:focus-visible{outline-offset:-1px}

/* ── boş durum ───────────────────────────────────────────────────── */
.bos{color:var(--sonuk);font-size:11px;font-style:italic;padding:10px 0}

/* uzun ülke adı Δ değerini alt satıra itmesin */
.satir .ad{min-width:0}
.satir .ad b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  display:inline-block;max-width:100%}
.satir .ad em{flex:0 0 auto;white-space:nowrap}

/* ── zaman kaydırıcısı ───────────────────────────────────────────── */
#zaman-kutu{margin-top:9px;padding-top:8px;border-top:1px solid var(--hat)}
.zaman-ust{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}
.zaman-et{color:var(--sonuk);font-size:9px;text-transform:uppercase;letter-spacing:.14em}
#bugune-don{background:none;border:1px solid rgba(217,162,68,.45);color:var(--kehribar);
  font:inherit;font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;
  padding:1px 5px;cursor:pointer}
#bugune-don:hover{background:rgba(217,162,68,.14)}
#zaman-kaydirici{width:100%;-webkit-appearance:none;appearance:none;height:3px;
  background:rgba(170,205,212,.16);outline:none;cursor:pointer;margin:2px 0}
#zaman-kaydirici::-webkit-slider-thumb{-webkit-appearance:none;width:11px;height:11px;
  background:var(--kehribar);cursor:pointer;border:0}
#zaman-kaydirici::-moz-range-thumb{width:11px;height:11px;background:var(--kehribar);
  cursor:pointer;border:0;border-radius:0}
.zaman-alt{display:flex;justify-content:space-between;align-items:baseline;margin-top:3px}
#zaman-etiket{color:var(--beyaz);font-size:11px;font-variant-numeric:tabular-nums}
#zaman-etiket.gecmis{color:var(--kehribar)}
.gecmis-uyari{border-left:2px solid var(--kehribar);padding:8px 0 8px 10px;margin-top:10px;
  background:rgba(217,162,68,.05);font-size:10.5px;line-height:1.6;color:var(--metin)}

/* arama sonucundaki belge satırları — başlık sarmalı, uzun olabilir */
.belge-satir .ad b{white-space:normal !important;overflow:visible !important;
  text-overflow:clip !important;display:inline !important}
.belge-satir{padding-top:8px;padding-bottom:8px}

/* ── dil seçici ──────────────────────────────────────────────────── */
#dil-sec{display:inline-flex;border:1px solid var(--hat);margin-left:2px}
#dil-sec button{background:none;border:0;color:var(--sonuk);font:inherit;font-size:9px;
  letter-spacing:.1em;padding:2px 6px;cursor:pointer;border-bottom:0 !important}
#dil-sec button+button{border-left:1px solid var(--hat)}
#dil-sec button:hover{color:var(--metin)}
#dil-sec button[aria-pressed="true"]{background:rgba(217,162,68,.16);color:var(--kehribar)}

/* Üst şerit dar ekranda taşmasın: göstergeler daralır, sağdaki gezinme
   her zaman görünür kalır. Dil seçicinin kesilmesi kabul edilemez. */
#ust{overflow:hidden}
#gostergeler{min-width:0;overflow:hidden;flex:1 1 auto}
#ust .sag{flex:0 0 auto;white-space:nowrap}
@media (max-width:1500px){ #zaman{display:none} }
@media (max-width:1280px){ #gostergeler .gosterge:nth-child(n+6){display:none} }
@media (max-width:1050px){ #gostergeler .gosterge:nth-child(n+4){display:none} }

/* ── arketip katmanı ─────────────────────────────────────────────── */
.ark-nokta{display:inline-block;width:8px;height:8px;margin-right:7px;
  vertical-align:0;border-radius:1px}
.ark-satir .ad em{color:var(--sonuk)}
.ulke-cip{display:inline-block;border:1px solid var(--hat);padding:1px 5px;margin:0 4px 4px 0;
  font-size:9.5px;letter-spacing:.06em;color:var(--sonuk)}
.ulke-cip.olculen{color:var(--kehribar);border-color:rgba(217,162,68,.5);cursor:pointer}
.ulke-cip.olculen:hover{background:rgba(217,162,68,.12)}

/* ── efsane: arketip + ölçüm iki ayrı blok ───────────────────────── */
#efsane{text-align:left;max-width:330px;flex:0 0 auto}
.efsane-blok+.efsane-blok{margin-top:9px;padding-top:8px;border-top:1px solid var(--hat)}
.efsane-baslik{color:var(--sonuk);font-size:8.5px;letter-spacing:.16em;
  text-transform:uppercase;margin-bottom:5px}
.efsane-ark{display:flex;flex-wrap:wrap;gap:3px 8px;pointer-events:auto}
.efsane-ark button{background:none;border:0;color:var(--metin);font:inherit;font-size:9.5px;
  cursor:pointer;padding:1px 0;display:inline-flex;align-items:center;white-space:nowrap}
.efsane-ark button:hover{color:var(--beyaz)}
.efsane-ark button i{width:7px;height:7px;margin-right:5px;border-radius:1px;flex:0 0 auto}
#efsane>.efsane-blok>div{line-height:1.85}
.ulke-cip{cursor:pointer;transition:background .12s,color .12s}
.ulke-cip:hover{color:var(--beyaz);border-color:var(--hat-parlak)}
.ulke-cip.odak{color:var(--beyaz);border-color:var(--beyaz);background:rgba(255,255,255,.08)}

/* ── küre görünüm denetimleri ────────────────────────────────────── */
#kure-denetim{position:absolute;right:14px;top:14px;z-index:6;display:flex;
  flex-direction:column;gap:1px;background:var(--hat)}
#kure-denetim button{width:28px;height:28px;background:rgba(5,8,10,.86);border:0;
  color:var(--sonuk);font:inherit;font-size:13px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;transition:color .13s,background .13s}
#kure-denetim button:hover{color:var(--beyaz);background:rgba(217,162,68,.14)}
#kure-denetim button[aria-pressed="true"]{color:var(--kehribar)}
@media (max-width:820px){
  #kure-denetim{right:10px;top:10px}
  #kure-denetim button{width:36px;height:36px;font-size:15px}
}