
/* ══════════════════════════════════════════════════════════
   burcevi.com — mobil öncelikli stil
   ══════════════════════════════════════════════════════════ */
:root{
  color-scheme:dark;
  --void:#0a0e27; --deep:#151d42; --line:#222d58; 
  --gold:#d4af37; --amber:#f0d68f; --ice:#a8bce4; --star:#f0f2ff; --dim:#8b93c4;
  --fire:#e08a4a; --earth:#6fae68; --air:#6fa4d8; --water:#8f7fd0;

  --display:"Cormorant Garamond",Georgia,"Times New Roman",serif;
  --body:"Jost",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --data:ui-monospace,"SF Mono",Menlo,Consolas,monospace;

  /* akışkan ölçek: telefondan masaüstüne yumuşak geçiş */
  --pad:clamp(16px,4.5vw,28px);
  --gap:clamp(9px,2.4vw,14px);
  --sec:clamp(26px,7vw,44px);
  --t-h1:clamp(1.85rem,7.2vw,3rem);
  --t-h2:clamp(1.24rem,4.4vw,1.6rem);
  --t-h3:clamp(1.02rem,3.4vw,1.16rem);
  --t-body:clamp(.94rem,2.9vw,1rem);
  --t-lead:clamp(1rem,3.4vw,1.1rem);
  --t-small:clamp(.78rem,2.4vw,.85rem);
  --r:10px; --r-lg:14px;
  --hdr:56px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;background:var(--void)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

body{
  /* saydam olmalı: zemin rengi html'de duruyor, boylece #bg yildiz katmani gorunur */
  background:transparent;color:var(--star);
  font-family:var(--body);font-weight:300;font-size:var(--t-body);line-height:1.72;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  overflow-x:hidden;overflow-wrap:break-word;
  padding-bottom:env(safe-area-inset-bottom);
}

/* ── klavye için atlama bağlantısı ── */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold);
  color:#0a0e27;padding:12px 18px;border-radius:0 0 var(--r) 0;font-size:.85rem}
.skip:focus{left:0}

/* ══ zemin: akan gece gökyüzü — yıldızlar, nebula, gezegenler ══ */
#bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  background:
  radial-gradient(ellipse 60% 45% at 15% 12%,rgba(120,96,196,.20),transparent 68%),
  radial-gradient(ellipse 55% 40% at 85% 22%,rgba(58,112,184,.18),transparent 70%),
  radial-gradient(ellipse 50% 40% at 30% 88%,rgba(96,74,172,.16),transparent 70%),
  var(--void)}

/* kayan yıldız katmanları: 200% yükseklik + %50 kaydırma = kusursuz döngü */
.sf{position:absolute;left:0;right:0;top:0;height:200%;display:block;
  background-repeat:repeat;will-change:transform}
.sf1{opacity:.55;background-size:300px 300px;
  animation:sky 210s linear infinite,tw 7s ease-in-out infinite;
  background-image:
radial-gradient(0.93px 0.93px at 56.9% 63.3%,#cfe0ff,transparent),
radial-gradient(1.35px 1.35px at 89.4% 63.2%,#cfe0ff,transparent),
radial-gradient(0.81px 0.81px at 31.9% 93.2%,#ffffff,transparent),
radial-gradient(0.83px 0.83px at 78.3% 62.0%,#ffffff,transparent),
radial-gradient(1.36px 1.36px at 90.4% 63.4%,#ffffff,transparent),
radial-gradient(0.83px 0.83px at 93.8% 48.7%,#ffe9c4,transparent),
radial-gradient(1.36px 1.36px at 67.4% 85.8%,#ffffff,transparent),
radial-gradient(1.21px 1.21px at 83.3% 73.0%,#ffffff,transparent),
radial-gradient(0.92px 0.92px at 22.5% 39.6%,#dbe4ff,transparent),
radial-gradient(0.80px 0.80px at 84.3% 51.0%,#fff4dd,transparent),
radial-gradient(1.28px 1.28px at 61.8% 33.3%,#ffe9c4,transparent),
radial-gradient(0.81px 0.81px at 43.3% 24.5%,#cfe0ff,transparent),
radial-gradient(1.17px 1.17px at 0.3% 86.4%,#dbe4ff,transparent),
radial-gradient(0.99px 0.99px at 14.1% 48.2%,#cfe0ff,transparent),
radial-gradient(1.32px 1.32px at 50.3% 52.3%,#fff4dd,transparent),
radial-gradient(0.91px 0.91px at 60.8% 9.7%,#cfe0ff,transparent),
radial-gradient(1.01px 1.01px at 11.6% 14.4%,#ffe9c4,transparent),
radial-gradient(1.30px 1.30px at 40.1% 40.2%,#fff4dd,transparent),
radial-gradient(1.01px 1.01px at 97.5% 92.9%,#fff4dd,transparent),
radial-gradient(0.95px 0.95px at 93.7% 3.0%,#dbe4ff,transparent),
radial-gradient(1.27px 1.27px at 76.4% 43.8%,#ffffff,transparent),
radial-gradient(1.39px 1.39px at 66.6% 53.8%,#fff4dd,transparent),
radial-gradient(1.13px 1.13px at 17.9% 67.5%,#ffffff,transparent),
radial-gradient(0.93px 0.93px at 91.7% 71.1%,#ffe9c4,transparent),
radial-gradient(0.92px 0.92px at 2.6% 16.8%,#ffffff,transparent),
radial-gradient(1.25px 1.25px at 97.0% 78.9%,#ffffff,transparent),
radial-gradient(0.93px 0.93px at 17.0% 36.9%,#fff4dd,transparent),
radial-gradient(1.39px 1.39px at 84.1% 45.2%,#fff4dd,transparent),
radial-gradient(1.19px 1.19px at 51.5% 79.4%,#dbe4ff,transparent),
radial-gradient(1.06px 1.06px at 45.4% 6.2%,#fff4dd,transparent),
radial-gradient(1.04px 1.04px at 65.2% 50.7%,#cfe0ff,transparent),
radial-gradient(1.28px 1.28px at 93.2% 39.2%,#ffe9c4,transparent),
radial-gradient(0.88px 0.88px at 7.5% 25.1%,#dbe4ff,transparent),
radial-gradient(1.24px 1.24px at 93.5% 12.7%,#ffe9c4,transparent),
radial-gradient(1.26px 1.26px at 60.3% 95.2%,#cfe0ff,transparent),
radial-gradient(1.29px 1.29px at 63.9% 85.8%,#fff4dd,transparent),
radial-gradient(0.88px 0.88px at 42.7% 8.0%,#dbe4ff,transparent),
radial-gradient(0.92px 0.92px at 0.9% 74.8%,#ffffff,transparent),
radial-gradient(0.83px 0.83px at 61.0% 45.8%,#ffe9c4,transparent),
radial-gradient(1.22px 1.22px at 38.3% 69.3%,#dbe4ff,transparent)}
.sf2{opacity:.75;background-size:420px 420px;
  animation:sky 130s linear infinite,tw 5.5s ease-in-out infinite;
  background-image:
radial-gradient(1.96px 1.96px at 48.4% 29.2%,#ffffff,transparent),
radial-gradient(1.42px 1.42px at 69.8% 57.7%,#cfe0ff,transparent),
radial-gradient(1.62px 1.62px at 63.1% 25.0%,#ffffff,transparent),
radial-gradient(1.89px 1.89px at 15.5% 12.6%,#dbe4ff,transparent),
radial-gradient(1.65px 1.65px at 97.0% 80.8%,#ffffff,transparent),
radial-gradient(2.06px 2.06px at 92.7% 38.6%,#ffe9c4,transparent),
radial-gradient(1.90px 1.90px at 29.1% 70.4%,#cfe0ff,transparent),
radial-gradient(1.66px 1.66px at 89.0% 92.9%,#fff4dd,transparent),
radial-gradient(1.74px 1.74px at 86.7% 40.3%,#fff4dd,transparent),
radial-gradient(1.70px 1.70px at 22.9% 60.2%,#ffe9c4,transparent),
radial-gradient(1.44px 1.44px at 46.5% 83.3%,#ffffff,transparent),
radial-gradient(1.34px 1.34px at 18.4% 11.8%,#ffe9c4,transparent),
radial-gradient(1.48px 1.48px at 12.9% 29.9%,#ffffff,transparent),
radial-gradient(2.06px 2.06px at 3.0% 96.5%,#cfe0ff,transparent),
radial-gradient(2.08px 2.08px at 62.2% 42.6%,#cfe0ff,transparent),
radial-gradient(1.85px 1.85px at 95.5% 4.8%,#cfe0ff,transparent),
radial-gradient(1.59px 1.59px at 64.3% 74.2%,#dbe4ff,transparent),
radial-gradient(1.85px 1.85px at 60.6% 61.4%,#ffffff,transparent),
radial-gradient(1.62px 1.62px at 63.2% 7.1%,#fff4dd,transparent),
radial-gradient(1.64px 1.64px at 63.4% 37.8%,#ffffff,transparent),
radial-gradient(1.68px 1.68px at 21.5% 43.2%,#ffffff,transparent),
radial-gradient(1.84px 1.84px at 1.7% 42.6%,#ffffff,transparent),
radial-gradient(1.34px 1.34px at 2.1% 36.2%,#ffffff,transparent),
radial-gradient(1.73px 1.73px at 95.5% 85.9%,#ffe9c4,transparent),
radial-gradient(1.98px 1.98px at 93.4% 97.8%,#ffffff,transparent),
radial-gradient(1.41px 1.41px at 27.3% 10.6%,#ffe9c4,transparent)}
.sf3{opacity:.9;background-size:620px 620px;
  animation:sky 78s linear infinite,tw 4s ease-in-out infinite;
  background-image:
radial-gradient(2.68px 2.68px at 69.1% 31.8%,#ffffff,transparent),
radial-gradient(2.46px 2.46px at 95.6% 13.5%,#fff4dd,transparent),
radial-gradient(2.59px 2.59px at 83.5% 85.2%,#ffffff,transparent),
radial-gradient(2.35px 2.35px at 56.9% 82.9%,#ffffff,transparent),
radial-gradient(3.36px 3.36px at 79.9% 13.6%,#fff4dd,transparent),
radial-gradient(2.40px 2.40px at 36.1% 20.9%,#ffffff,transparent),
radial-gradient(2.53px 2.53px at 2.0% 90.1%,#fff4dd,transparent),
radial-gradient(2.57px 2.57px at 63.1% 16.1%,#dbe4ff,transparent),
radial-gradient(3.38px 3.38px at 56.7% 50.7%,#ffffff,transparent),
radial-gradient(2.49px 2.49px at 55.5% 95.4%,#ffffff,transparent),
radial-gradient(2.96px 2.96px at 61.4% 97.5%,#ffffff,transparent),
radial-gradient(3.40px 3.40px at 92.2% 66.3%,#ffe9c4,transparent),
radial-gradient(2.59px 2.59px at 5.8% 82.7%,#ffffff,transparent),
radial-gradient(2.67px 2.67px at 55.6% 2.3%,#ffe9c4,transparent)}
@keyframes sky{from{transform:translate3d(0,0,0)}to{transform:translate3d(0,-50%,0)}}
@keyframes tw{0%,100%{filter:brightness(1)}50%{filter:brightness(1.45)}}

/* yavaşça süzülen samanyolu bandı */
.neb{position:absolute;left:-20%;right:-20%;top:0;height:200%;display:block;
  opacity:.5;will-change:transform;animation:sky 300s linear infinite;
  background-repeat:repeat;background-size:100% 50%;
  background-image:
   radial-gradient(ellipse 42% 13% at 28% 24%,rgba(132,104,214,.30),transparent 72%),
   radial-gradient(ellipse 36% 10% at 72% 58%,rgba(64,128,200,.26),transparent 72%),
   radial-gradient(ellipse 30% 9%  at 46% 86%,rgba(196,150,236,.20),transparent 74%)}

/* kayan yıldızlar (göktaşı) */
.shoot{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;
  box-shadow:0 0 10px 4px rgba(255,255,255,.7);opacity:0;
  animation:shoot var(--sd,18s) linear infinite;animation-delay:var(--sdl,0s)}
.shoot::after{content:"";position:absolute;right:1px;top:50%;width:150px;height:1.4px;
  transform:translateY(-50%);
  background:linear-gradient(to left,rgba(255,255,255,.95),transparent)}
@keyframes shoot{0%{opacity:0;transform:translate3d(0,0,0)}2%{opacity:1}
                 11%{opacity:1;transform:translate3d(-380px,250px,0)}
                 13%,100%{opacity:0;transform:translate3d(-380px,250px,0)}}

/* süzülen gezegenler */
.pl{position:absolute;border-radius:50%;display:block;will-change:transform;
  box-shadow:inset -3px -3px 8px rgba(0,0,0,.45)}
.pl1{top:14%;left:-8%;width:26px;height:26px;opacity:.72;
  background:radial-gradient(circle at 32% 28%,#f6d9a8,#b9743a 68%,#7d4a22);
  animation:drift1 88s linear infinite}
.pl2{top:63%;left:-8%;width:16px;height:16px;opacity:.66;
  background:radial-gradient(circle at 32% 28%,#dbe9fb,#5f86b4 68%,#3d5a80);
  animation:drift2 124s linear infinite;animation-delay:-40s}
.pl3{top:36%;left:-10%;width:30px;height:30px;opacity:.6;
  background:radial-gradient(circle at 32% 28%,#f2e6bd,#a3946a 68%,#6d6244);
  animation:drift3 168s linear infinite;animation-delay:-90s}
.pl3::after{content:"";position:absolute;inset:-5px -14px;border:1.5px solid rgba(240,228,182,.55);
  border-radius:50%;transform:rotate(-18deg)}
.pl4{top:80%;left:-8%;width:12px;height:12px;opacity:.55;
  background:radial-gradient(circle at 32% 28%,#e4c6f2,#8f5fa8 68%,#5f3d72);
  animation:drift2 146s linear infinite;animation-delay:-115s}
@keyframes drift1{from{transform:translate3d(0,0,0)}to{transform:translate3d(122vw,6vh,0)}}
@keyframes drift2{from{transform:translate3d(0,0,0)}to{transform:translate3d(122vw,-8vh,0)}}
@keyframes drift3{from{transform:translate3d(0,0,0)}to{transform:translate3d(122vw,4vh,0)}}

/* hareket azaltma tercihi: gökyüzü sabit kalsın */
@media(prefers-reduced-motion:reduce){
  .sf,.neb,.pl,.shoot{animation:none}
  .shoot,.pl{display:none}
}

/* tutulma görseli */
.eclipse{width:min(88vw,420px);height:auto;display:block;margin:6px auto 26px;
  filter:drop-shadow(0 0 34px rgba(224,189,118,.22))}
.eclipse #cor{transform-origin:470px 500px;animation:corona 11s ease-in-out infinite}
.eclipse #streamers{transform-origin:470px 500px;animation:breathe 17s ease-in-out infinite}
.eclipse #zring{transform-origin:500px 500px;animation:sky2 340s linear infinite}
@keyframes corona{0%,100%{opacity:.6;transform:scale(1)}50%{opacity:.95;transform:scale(1.05)}}
@keyframes breathe{0%,100%{opacity:.75;transform:scale(.985) rotate(0)}
                   50%{opacity:1;transform:scale(1.02) rotate(1.2deg)}}
@keyframes sky2{from{transform:rotate(0)}to{transform:rotate(360deg)}}

/* ══ üst çubuk ══ */
.top{position:sticky;top:0;z-index:60;
  background:rgba(10,14,39,.9);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
  padding-top:env(safe-area-inset-top)}
.top .in{max-width:1060px;margin:0 auto;padding:0 var(--pad);
  display:flex;align-items:center;gap:clamp(8px,2vw,18px);min-height:var(--hdr)}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;flex:0 0 auto}
.brand svg{width:24px;height:24px;flex:0 0 auto}
.brand span{font-family:var(--display);font-size:1rem;color:var(--star);
  letter-spacing:.03em;white-space:nowrap}
@media(max-width:420px){.brand span{font-size:.94rem}}
@media(max-width:330px){.brand span{display:none}}

.nav{display:flex;gap:2px;flex:1;min-width:0}
.nav::-webkit-scrollbar{display:none}

/* ── hamburger düğmesi ── */
.mnu{display:none;margin-left:auto;flex:0 0 auto;width:46px;height:46px;
  background:none;border:1px solid transparent;border-radius:10px;cursor:pointer;
  padding:0;align-items:center;justify-content:center;flex-direction:column;gap:5px;
  -webkit-tap-highlight-color:transparent;transition:border-color .2s}
.mnu span{display:block;width:19px;height:1.6px;background:var(--gold);border-radius:2px;
  transition:transform .25s,opacity .2s}
.mnu[aria-expanded="true"]{border-color:var(--gold)}
.mnu[aria-expanded="true"] span:nth-child(1){transform:translateY(6.6px) rotate(45deg)}
.mnu[aria-expanded="true"] span:nth-child(2){opacity:0}
.mnu[aria-expanded="true"] span:nth-child(3){transform:translateY(-6.6px) rotate(-45deg)}

@media(max-width:860px){
  .mnu{display:flex}
  .nav{position:fixed;left:0;right:0;top:calc(var(--hdr) + env(safe-area-inset-top));
    flex-direction:column;gap:0;background:rgba(10,14,39,.98);
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    border-bottom:1px solid var(--line);
    max-height:calc(100svh - var(--hdr));overflow-y:auto;
    padding:8px var(--pad) calc(16px + env(safe-area-inset-bottom));
    transform:translateY(-8px);opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .2s,transform .2s,visibility .2s;
    box-shadow:0 18px 40px rgba(0,0,0,.55)}
  .nav.on{transform:none;opacity:1;visibility:visible;pointer-events:auto}
  .nav a{width:100%;justify-content:flex-start;min-height:52px;padding:14px 12px;
    border:0;border-radius:8px;border-bottom:1px solid rgba(34,45,88,.7);
    font-size:12px;letter-spacing:.15em}
  .nav a:last-child{border-bottom:0}
  .nav a[aria-current="page"]{background:rgba(212,175,55,.1)}
  body.kilit{overflow:hidden}
}
.nav a{flex:0 0 auto;color:var(--dim);text-decoration:none;
  font-size:clamp(10px,2.6vw,11px);letter-spacing:.13em;text-transform:uppercase;
  padding:8px 11px;border-radius:999px;min-height:44px;display:flex;align-items:center;
  white-space:nowrap;border:1px solid transparent;
  -webkit-tap-highlight-color:transparent;transition:color .2s,border-color .2s,background .2s}
.nav a:hover{color:var(--amber)}
.nav a[aria-current="page"]{color:var(--amber);border-color:var(--gold);
  background:rgba(212,175,55,.08)}

/* ══ ana kolon ══ */
.page{max-width:760px;margin:0 auto;padding:0 var(--pad) var(--sec)}
.crumbs{font-size:clamp(10px,2.6vw,11.5px);color:var(--dim);padding:14px 0 0;
  display:flex;flex-wrap:wrap;gap:5px 7px;align-items:center}
.crumbs a{color:var(--ice);text-decoration:none}
.crumbs a:hover{text-decoration:underline}
.crumbs i{font-style:normal;opacity:.45}
.crumbs span{opacity:.65}

.phead{padding:clamp(18px,5vw,32px) 0 4px}
.kick{font-size:clamp(9.5px,2.4vw,10.5px);letter-spacing:.26em;text-transform:uppercase;
  color:var(--gold);display:block;margin-bottom:9px}
h1{font-family:var(--display);font-weight:300;font-size:var(--t-h1);line-height:1.12;
  letter-spacing:.005em;text-wrap:balance}
h1 em{font-style:italic;font-weight:400;color:var(--amber)}

/* ── metin ── */
main h2{font-family:var(--display);font-weight:400;font-size:var(--t-h2);color:var(--star);
  margin:var(--sec) 0 10px;line-height:1.25;text-wrap:balance}
main h3{font-family:var(--display);font-weight:400;font-size:var(--t-h3);color:var(--amber);
  margin:22px 0 6px;line-height:1.3}
main p{color:#c6cde5;line-height:1.78;margin-bottom:13px;text-wrap:pretty}
.lead{font-size:var(--t-lead);color:#dbe1f5;line-height:1.76;margin:14px 0 20px}
main a{color:var(--amber);text-underline-offset:3px}
main a:hover{color:#fff}
strong,b{font-weight:400;color:var(--star)}

/* ── odak halkası: her yerde görünür ── */
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{
  outline:2px solid var(--amber);outline-offset:3px;border-radius:4px}

/* ══ bileşenler ══ */
.facts{display:grid;grid-template-columns:auto 1fr;gap:8px clamp(12px,3vw,20px);
  margin:18px 0 6px;border:1px solid var(--line);border-radius:var(--r);
  padding:clamp(14px,3.6vw,20px);background:rgba(21,29,66,.42)}
.facts dt{color:var(--dim);font-size:var(--t-small);letter-spacing:.04em}
.facts dd{color:#dbe1f5;font-size:var(--t-small)}

.tbl{width:100%;border-collapse:collapse;font-size:var(--t-small);margin:14px 0}
.tbl th{text-align:left;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--dim);font-weight:400;padding-bottom:9px}
.tbl td{padding:11px 0;border-top:1px solid rgba(34,45,88,.9);color:#c6cde5}
.tbl td:last-child,.tbl th:last-child{text-align:right}
.tbl .num{font-family:var(--data);font-size:.82em;color:var(--ice)}
.tbl a{text-decoration:none}

.cards{display:grid;gap:var(--gap);margin:22px 0}
.card{border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(21,29,66,.42);
  padding:clamp(14px,3.6vw,19px);text-decoration:none;display:block;
  -webkit-tap-highlight-color:transparent;
  transition:border-color .22s,transform .22s,background .22s}
.card:hover,.card:focus-visible{border-color:var(--gold);background:rgba(28,38,84,.55)}
.card:active{transform:scale(.985)}
.card h3{margin:0 0 4px;color:var(--amber)}
.card p{margin:0;font-size:var(--t-small);color:var(--dim)}

.sgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap)}
.scard{border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(21,29,66,.45);
  padding:clamp(13px,3.4vw,17px);text-decoration:none;display:block;min-height:112px;
  -webkit-tap-highlight-color:transparent;transition:border-color .22s,transform .22s}
.scard:hover,.scard:focus-visible{border-color:var(--gold)}
.scard:active{transform:scale(.98)}
.scard .g{font-size:clamp(1.6rem,5.4vw,2rem);line-height:1;color:var(--amber)}
.scard .n{font-family:var(--display);font-size:clamp(1.06rem,3.4vw,1.2rem);
  margin-top:6px;color:var(--star)}
.scard .d{font-family:var(--data);font-size:.66rem;color:var(--ice);margin-top:3px}
.scard .e{font-size:9px;letter-spacing:.18em;text-transform:uppercase;margin-top:7px}

.chipgrid{display:flex;flex-wrap:wrap;gap:7px;margin:16px 0}
.chip{border:1px solid var(--line);border-radius:999px;padding:9px 14px;
  text-decoration:none;color:#dbe1f5;font-size:var(--t-small);min-height:44px;
  display:inline-flex;align-items:center;gap:6px;
  -webkit-tap-highlight-color:transparent;transition:border-color .2s}
.chip:hover,.chip:focus-visible{border-color:var(--gold)}

.pairlist{display:grid;gap:7px;margin:18px 0}
.pairitem{display:flex;justify-content:space-between;align-items:center;gap:12px;
  border:1px solid var(--line);border-radius:var(--r);padding:13px 15px;
  text-decoration:none;min-height:52px;background:rgba(21,29,66,.38);
  -webkit-tap-highlight-color:transparent;transition:border-color .2s,background .2s}
.pairitem:hover,.pairitem:focus-visible{border-color:var(--gold);background:rgba(28,38,84,.5)}
.pairitem .pn{color:#dbe1f5;font-size:var(--t-small)}
.pairitem .pp{font-family:var(--data);font-size:.84rem;flex:0 0 auto}

.scorebox{display:flex;align-items:center;gap:clamp(12px,3.4vw,18px);
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(15px,4vw,20px);background:rgba(21,29,66,.5);margin:18px 0}
.scorebox b{font-family:var(--display);font-weight:500;
  font-size:clamp(1.9rem,7vw,2.4rem);color:var(--amber);
  min-width:72px;text-align:center;line-height:1}
.scorebox>div{flex:1;min-width:0}
.scorebox .lbl{font-size:var(--t-small);color:#c6cde5;margin-bottom:8px}
.bar{height:6px;border-radius:3px;background:rgba(255,255,255,.08);overflow:hidden}
.bar i{display:block;height:100%;border-radius:3px}

.cta{margin:var(--sec) 0 8px}
.cta a{display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--gold);border-radius:var(--r);color:var(--amber);
  text-decoration:none;font-size:clamp(10.5px,2.8vw,11.5px);letter-spacing:.2em;
  text-transform:uppercase;padding:16px 24px;min-height:52px;width:100%;
  text-align:center;-webkit-tap-highlight-color:transparent;
  transition:background .25s,color .25s}
.cta a:hover,.cta a:active{background:var(--gold);color:#0a0e27}

.rel{font-size:var(--t-small);color:var(--dim);margin-top:18px}
.note{font-size:var(--t-small);color:var(--dim);border-left:2px solid var(--line);
  padding-left:14px;margin:18px 0}
.small{font-size:.8rem;color:var(--dim);line-height:1.7}
.mono{font-family:var(--data);font-size:.85rem;color:var(--ice)}

/* ── reklam yuvası: yer kaymasını önlemek için alan ayrılır ── */
/* Reklam yuvası: boşken hiç yer kaplamaz. İçine kod konunca kendiliğinden açılır. */
.adslot:empty{display:none}
.adslot{margin:var(--sec) 0;min-height:0;contain:layout;text-align:center}

/* ── alt bilgi ── */
.foot{border-top:1px solid var(--line);margin-top:var(--sec);
  padding:clamp(22px,6vw,32px) 0 calc(env(safe-area-inset-bottom) + 44px)}
.foot .in{max-width:760px;margin:0 auto;padding:0 var(--pad)}
.foot p{font-size:var(--t-small);color:var(--dim);line-height:1.72;margin-bottom:8px}
.foot .links{display:flex;flex-wrap:wrap;gap:10px 16px;margin:14px 0}
/* ── araç kutusu ── */
.toolbox{border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(21,29,66,.5);
  padding:clamp(15px,4vw,22px);margin:20px 0}
.toolgrid{display:grid;gap:12px}
.field{display:flex;flex-direction:column;gap:6px;position:relative}
.field label{font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim)}
.field input,.field select{background:rgba(12,18,40,.72);border:1px solid var(--line);
  border-radius:var(--r);color:var(--star);font-family:var(--body);font-size:16px;
  padding:14px;width:100%;min-height:50px;-webkit-appearance:none;appearance:none}
.field select{background-image:linear-gradient(45deg,transparent 50%,var(--dim) 50%),
  linear-gradient(135deg,var(--dim) 50%,transparent 50%);
  background-position:calc(100% - 20px) 22px,calc(100% - 14px) 22px;
  background-size:6px 6px,6px 6px;background-repeat:no-repeat;padding-right:44px}
.field input:focus,.field select:focus{outline:none;border-color:var(--gold)}
.hits{position:absolute;top:100%;left:0;right:0;z-index:40;margin-top:5px;background:#141c40;
  border:1px solid var(--line);border-radius:var(--r);max-height:42vh;overflow:hidden auto;
  display:none;box-shadow:0 14px 32px rgba(0,0,0,.7);-webkit-overflow-scrolling:touch}
.hits.on{display:block}
.hits button{display:block;width:100%;text-align:left;background:none;border:0;
  color:var(--star);font-family:var(--body);font-size:15px;padding:13px 15px;
  min-height:48px;cursor:pointer}
.hits button:hover,.hits button:focus{background:var(--line);outline:none}
.hits small{color:var(--dim);margin-left:8px;font-size:.74rem}
.gobtn{width:100%;margin-top:14px;border:1px solid var(--gold);border-radius:var(--r);
  background:rgba(212,175,55,.08);color:var(--amber);font-family:var(--body);
  font-size:11.5px;letter-spacing:.26em;text-transform:uppercase;padding:16px;
  min-height:54px;cursor:pointer;-webkit-tap-highlight-color:transparent;
  transition:background .25s,color .25s}
.gobtn:hover,.gobtn:active{background:var(--gold);color:#0a0e27}
.warn{color:#d98fa6;font-size:var(--t-small);min-height:1.1em;margin-top:10px}
#sonuc{margin:20px 0}
.stat{border:1px solid var(--line);border-radius:var(--r);padding:13px 15px;
  background:rgba(21,29,66,.5)}
.stat h4{font-family:var(--display);font-weight:500;font-size:1rem;color:var(--amber);
  margin-bottom:3px}
.stat p{font-size:var(--t-small);color:#c6cde5;margin:0}
@media(min-width:600px){.toolgrid{grid-template-columns:1fr 1fr}
  .toolgrid .field:has(#c){grid-column:1/-1}
  .gobtn{width:auto;min-width:220px}}

.taze{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim);
  margin-top:12px;display:inline-block;border:1px solid var(--line);border-radius:999px;
  padding:5px 12px}
/* ── tam harita aracı çıktısı ── */
.dorttemel{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--gap);margin:18px 0}
.tkart{border:1px solid var(--line);border-radius:var(--r-lg);background:rgba(21,29,66,.5);
  padding:15px 13px;text-align:center;text-decoration:none;display:block;
  transition:border-color .22s,transform .22s;-webkit-tap-highlight-color:transparent}
.tkart:hover,.tkart:focus-visible{border-color:var(--gold)}
.tkart:active{transform:scale(.98)}
.tkart .rol{display:block;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim)}
.tkart .gl{display:block;font-size:clamp(1.7rem,6vw,2.1rem);line-height:1;margin:8px 0 4px}
.tkart .brc{display:block;font-family:var(--display);font-size:clamp(1.05rem,3.6vw,1.25rem);color:var(--star)}
.tkart .drc{display:block;font-family:var(--data);font-size:.66rem;color:var(--ice);margin-top:3px}
.kunye{font-family:var(--data);font-size:.71rem;color:var(--ice);background:rgba(21,29,66,.5);
  border-radius:var(--r);padding:11px 13px;margin-bottom:6px;word-break:break-word}
.carkkutu{margin:0 calc(var(--pad) * -1)}
#cark{width:100%;height:auto;display:block;filter:drop-shadow(0 0 26px rgba(212,175,55,.15))}
.evgrid{display:grid;grid-template-columns:1fr;gap:9px;margin:14px 0}
.evk{border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;background:rgba(21,29,66,.45)}
.evk h4{font-family:var(--display);font-weight:500;font-size:1rem;color:var(--amber);margin-bottom:3px}
.evk h4 a{color:var(--amber);text-decoration:none}
.evk p{font-size:var(--t-small);color:var(--dim);margin:0;line-height:1.55}
.yerlesim{border-top:1px solid rgba(34,45,88,.9);padding:14px 0}
.yerlesim h4{font-family:var(--display);font-weight:500;font-size:1.06rem;color:var(--amber);
  margin-bottom:3px}
.yerlesim h4 small{font-family:var(--data);font-size:.64rem;color:var(--ice);
  letter-spacing:.05em;margin-left:8px;font-weight:400}
.yerlesim p{font-size:var(--t-small);color:#c6cde5;margin:0;line-height:1.62}
.balance{display:grid;gap:9px;margin:14px 0}
/* sayfa ici gorsel (takimyildiz vb.) */
.gorsel{margin:26px 0 30px}
.gorsel svg,.gorsel img{width:100%;height:auto;display:block;border-radius:14px;
  border:1px solid var(--line)}
.gorsel figcaption{margin-top:11px;font-size:.86rem;line-height:1.6;color:var(--dim);
  text-align:center}
/* carkin altindaki element renk aciklamasi */
.legend{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 18px;
  margin:10px 0 4px;font-size:.86rem;color:var(--dim)}
.legend span{display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
.legend i{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.brow{display:grid;grid-template-columns:76px 1fr 34px;align-items:center;gap:11px}
.brow span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim)}
.brow em{font-family:var(--data);font-style:normal;font-size:.74rem;color:var(--ice);text-align:right}
.track{height:7px;border-radius:4px;background:rgba(255,255,255,.07);overflow:hidden}
.track i{display:block;height:100%;border-radius:4px}
@media(min-width:600px){.dorttemel{grid-template-columns:repeat(4,minmax(0,1fr))}
  .evgrid{grid-template-columns:1fr 1fr}}
@media(min-width:760px){.carkkutu{margin:0}}

.probolum{border-top:1px solid rgba(34,45,88,.9);padding-top:var(--sec);margin-top:var(--sec)}
.probolum:first-of-type{border-top:0;margin-top:14px}
#sonuc .scorebox{margin-top:0}
.foot .links a{color:var(--ice);text-decoration:none;font-size:var(--t-small);
  min-height:32px;display:inline-flex;align-items:center}
.foot .links a:hover{color:var(--amber)}

/* ══ kırılma noktaları ══ */
@media(min-width:520px){
  .sgrid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .cta a{width:auto}
}
@media(min-width:760px){
  .page{max-width:820px}
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sgrid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .foot .in{max-width:820px}
}
@media(min-width:1040px){
  .page{max-width:900px}
  .cards{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot .in{max-width:900px}
}

/* ══ hareket azaltma ══ */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
}

/* ══ yazdırma ══ */
@media print{
  #bg,.top,.adslot,.cta,.skip{display:none!important}
  body{background:#fff;color:#111}
  main p,.tbl td{color:#222}
  h1,main h2{color:#000}
  main a{color:#000;text-decoration:underline}
  .page{max-width:none}
}
