/* Wunderstrike — site stili. Renkler / yazı tipleri: art/marka/MARKA.md */
@font-face{font-family:"Pixelify Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/pixelify-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:"Pixelify Sans";font-style:normal;font-weight:400 700;font-display:swap;src:url(/fonts/pixelify-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/spacemono-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:"Space Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/spacemono-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/spacemono-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}
@font-face{font-family:"Space Mono";font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/spacemono-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-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --gece:#07070F;--panel:#120E2A;--panel2:#18123D;--cerceve:#3A2A6E;--cerceve2:#5B3FB0;
  --acik:#F4F1FF;--soluk:#B9B0DA;--krem:#FFF3A8;--kehribar:#FFB000;--turuncu:#FF8A00;
  --pembe:#FF2E88;--mor:#7A1150;--camgobegi:#2DE2E6;--saha:#0F3A2A;--saha2:#12452F;--yesil:#3DDC84;
  --px:"Pixelify Sans",ui-monospace,monospace;--mono:"Space Mono",ui-monospace,Menlo,monospace;
  --genis:1160px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--gece);color:var(--acik);font:15px/1.65 var(--mono);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--camgobegi)}
a:hover{color:var(--krem)}
:focus-visible{outline:3px solid var(--kehribar);outline-offset:3px}
.gizli{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.atla{position:absolute;left:-999px;top:8px;z-index:99;background:var(--kehribar);color:var(--gece);padding:8px 14px;font-family:var(--px)}
.atla:focus{left:8px}
.kap{max-width:var(--genis);margin:0 auto;padding:0 20px}
.piksel{image-rendering:pixelated;image-rendering:crisp-edges}
h1,h2,h3,.px{font-family:var(--px);font-weight:700;letter-spacing:.02em;line-height:1.15}
h2{font-size:clamp(28px,5vw,44px);margin:0 0 10px}
h3{font-size:22px;margin:0 0 6px}
p{margin:0 0 12px}

/* Düğmeler — oyundaki OYNA düğmesi gibi: kehribar, sert piksel gölge */
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:700 20px/1 var(--px);letter-spacing:.06em;
  text-transform:uppercase;text-decoration:none;color:var(--gece);background:var(--kehribar);padding:16px 26px;border:0;cursor:pointer;
  box-shadow:0 0 0 3px var(--krem) inset,6px 6px 0 var(--pembe);transition:transform .08s,box-shadow .08s}
.dugme:hover{color:var(--gece);transform:translate(-2px,-2px);box-shadow:0 0 0 3px var(--krem) inset,8px 8px 0 var(--pembe)}
.dugme:active{transform:translate(4px,4px);box-shadow:0 0 0 3px var(--krem) inset,2px 2px 0 var(--pembe)}
.dugme.kucuk{font-size:15px;padding:10px 16px;box-shadow:0 0 0 2px var(--krem) inset,4px 4px 0 var(--pembe)}
.dugme.ikincil{background:transparent;color:var(--acik);box-shadow:0 0 0 3px var(--cerceve2) inset}
.dugme.ikincil:hover{color:var(--krem);box-shadow:0 0 0 3px var(--camgobegi) inset}

/* Üst menü */
.ust{position:sticky;top:0;z-index:20;background:rgba(7,7,15,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:2px solid var(--panel2)}
.ust .kap{display:flex;align-items:center;gap:18px;height:64px}
.ust .logo img{height:34px;width:auto}
.ust nav{display:flex;gap:20px;margin-left:auto;align-items:center}
.ust nav a{font:400 17px var(--px);color:var(--soluk);text-decoration:none}
.ust nav a:hover{color:var(--krem)}
.dil{display:flex;font:700 14px var(--px)}
.dil a,.dil span{padding:4px 8px;text-decoration:none;color:var(--soluk);border:2px solid var(--cerceve)}
.dil span{background:var(--cerceve);color:var(--acik)}
.dil a+span,.dil span+a{border-left:0}
@media (max-width:760px){.ust nav .menu-baglanti{display:none}.ust .kap{gap:10px}.ust .logo img{height:28px}.ust nav{gap:10px}}

/* Kahraman: arkada maç videosu */
.kahraman{position:relative;min-height:min(92vh,860px);display:flex;align-items:center;overflow:hidden;isolation:isolate}
.kahraman video,.kahraman .poster{position:absolute;inset:-12px;width:calc(100% + 24px);height:calc(100% + 24px);object-fit:cover;z-index:-3;image-rendering:auto}
.kahraman::before{content:"";position:absolute;inset:0;z-index:-2;
  background:radial-gradient(ellipse at 50% 45%,rgba(7,7,15,.45),rgba(7,7,15,.88) 72%),linear-gradient(180deg,rgba(7,7,15,.55),rgba(7,7,15,.3) 28%,rgba(7,7,15,.88) 64%,var(--gece) 94%)}
.kahraman::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.55) 0 1px,transparent 1px 3px)}
.kahraman .kap{width:100%;text-align:center;padding-top:40px;padding-bottom:30px}
.tabela{width:min(760px,100%);margin:0 auto 18px;filter:drop-shadow(0 0 28px rgba(255,46,136,.35))}
.slogan{font:700 clamp(20px,3.4vw,30px)/1.25 var(--px);color:var(--krem);margin:0 auto 6px;max-width:760px;text-shadow:3px 3px 0 var(--mor)}
.alt-slogan{color:var(--acik);max-width:620px;margin:0 auto 26px;font-size:15px;text-shadow:0 1px 2px #000}
.cagri{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;align-items:center}
.magazalar{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:22px}
.rozet{display:flex;align-items:center;gap:10px;padding:8px 14px;background:rgba(18,14,42,.85);border:2px solid var(--cerceve);color:var(--soluk);font:400 14px/1.15 var(--px);text-align:left;min-width:168px}
.rozet svg{flex:none;width:22px;height:22px;fill:var(--acik)}
.rozet b{display:block;color:var(--acik);font-size:17px;font-weight:700}
.rozet small{font-size:12px;color:var(--kehribar);letter-spacing:.08em}
.yas{display:inline-block;margin-top:18px;font:700 13px var(--px);color:var(--soluk);letter-spacing:.06em}
.yas b{display:inline-block;background:var(--acik);color:var(--gece);padding:1px 6px;margin-right:6px}

/* Vitrin sırası: karakterler saha çizgisinde */
.sira{position:relative;display:flex;justify-content:center;align-items:flex-end;gap:clamp(2px,1.5vw,18px);margin:34px auto 0;height:150px;max-width:900px}
.sira::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:2px;background:linear-gradient(90deg,transparent,rgba(244,241,255,.35),transparent)}
.karakter{--k:15;display:block;width:128px;height:128px;flex:none;background-repeat:no-repeat;background-size:calc(var(--k)*100%) 100%;
  image-rendering:pixelated;animation:kare 1.65s steps(14) infinite}
.karakter.orta{width:150px;height:150px}
@keyframes kare{from{background-position:0 0}to{background-position:100% 0}}
@media (max-width:760px){.sira{height:96px}.karakter{width:80px;height:80px}.karakter.orta{width:96px;height:96px}.sira .uzak{display:none}}
@media (prefers-reduced-motion:reduce){.karakter{animation:none}html{scroll-behavior:auto}}

/* Bölümler */
.bolum{padding:88px 0;position:relative}
.bolum.koyu{background:linear-gradient(180deg,var(--gece),#0B0920 18%,#0B0920 82%,var(--gece))}
.ust-baslik{font:700 14px var(--px);letter-spacing:.24em;color:var(--camgobegi);text-transform:uppercase;margin:0 0 8px;display:flex;align-items:center;gap:10px}
.ust-baslik::before{content:"";width:10px;height:10px;background:currentColor;box-shadow:14px 0 0 var(--pembe),28px 0 0 var(--kehribar);margin-right:30px}
.giris{max-width:640px;color:var(--soluk);margin-bottom:38px}

/* Vurgular */
.vurgular{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.vurgu{background:var(--panel);border:2px solid var(--cerceve);display:flex;flex-direction:column;overflow:hidden}
.vurgu .gorsel{aspect-ratio:16/9;background:var(--saha);position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;
  background-image:repeating-linear-gradient(90deg,var(--saha) 0 40px,var(--saha2) 40px 80px)}
.vurgu .gorsel video{width:100%;height:100%;object-fit:cover;image-rendering:pixelated}
.vurgu .metin{padding:20px 22px 22px;border-top:2px solid var(--cerceve)}
.vurgu .metin p{color:var(--soluk);margin:0}
.vurgu h3{color:var(--krem)}
.vurgu .etiket{font:700 12px var(--px);color:var(--gece);background:var(--camgobegi);padding:2px 8px;letter-spacing:.1em;display:inline-block;margin-bottom:10px}
.vurgu:nth-child(2) .etiket{background:var(--pembe);color:var(--gece)}
.vurgu:nth-child(3) .etiket{background:var(--kehribar)}
.vurgu:nth-child(4) .etiket{background:var(--yesil)}
.armalar{display:flex;gap:6%;align-items:center;justify-content:center;width:100%}
.armalar img{width:22%;max-width:128px;height:auto;image-rendering:pixelated;animation:sek 2.4s steps(4) infinite}
.armalar img:nth-child(2){animation-delay:.8s}.armalar img:nth-child(3){animation-delay:1.6s}
@keyframes sek{0%,60%,100%{transform:translateY(0)}70%{transform:translateY(-10px)}80%{transform:translateY(-14px)}90%{transform:translateY(-6px)}}
.kart-oyuncu{display:flex;gap:18px;align-items:center}
.kart-oyuncu .kart{background:var(--panel);border:3px solid var(--kehribar);padding:10px 12px 8px;text-align:center;box-shadow:6px 6px 0 var(--mor)}
.kart-oyuncu .kart .karakter{width:112px;height:112px;margin:0 auto}
.kart-oyuncu .kart b{display:block;font:700 18px var(--px);color:var(--krem)}
.kart-oyuncu .kart small{font:400 12px var(--px);color:var(--soluk)}
.foto-ok{font:700 34px var(--px);color:var(--camgobegi)}
.foto{width:96px;height:120px;border:3px dashed var(--soluk);display:flex;align-items:center;justify-content:center;color:var(--soluk);background:rgba(7,7,15,.5)}
.foto svg{width:44px;height:44px;fill:var(--soluk)}
.dizi{display:flex;gap:4px;align-items:flex-end}
.dizi .karakter{width:96px;height:96px}
@media (max-width:820px){.vurgular{grid-template-columns:1fr}}

/* Modlar */
.modlar{display:grid;grid-template-columns:repeat(5,1fr);gap:14px}
.mod{--r:var(--kehribar);background:var(--panel);border:2px solid var(--cerceve);padding:16px 16px 18px 22px;position:relative;display:flex;flex-direction:column;gap:6px}
.mod::before{content:"";position:absolute;left:0;top:14px;bottom:14px;width:7px;background:var(--r)}
.mod h3{font-size:24px;margin:0}
.mod p{color:var(--soluk);font-size:13.5px;margin:0}
.mod .resim{height:88px;display:flex;align-items:flex-end;gap:4px;margin-bottom:6px}
.mod .resim img{height:64px;width:auto;image-rendering:pixelated;min-width:0;flex:0 1 auto;object-fit:contain}
.mod.m4 .resim img{height:auto;width:30%;max-width:64px}
.mod .resim .karakter{width:88px;height:88px}
.mod.m2{--r:var(--camgobegi)}.mod.m3{--r:var(--pembe)}.mod.m4{--r:var(--cerceve2)}.mod.m5{--r:var(--yesil)}
@media (max-width:1060px){.modlar{grid-template-columns:repeat(2,1fr)}.mod.m5{grid-column:1/-1}}
@media (max-width:520px){.modlar{grid-template-columns:1fr}}

/* Arkadaşla oyna */
.birlikte{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.birlikte .k{border:2px solid var(--cerceve);background:linear-gradient(180deg,var(--panel),#0D0A22);padding:22px}
.birlikte .rakam{font:700 46px/1 var(--px);color:var(--kehribar);text-shadow:4px 4px 0 var(--mor);margin-bottom:10px}
.birlikte .k:nth-child(2) .rakam{color:var(--camgobegi)}.birlikte .k:nth-child(3) .rakam{color:var(--pembe)}
.birlikte p{color:var(--soluk);margin:0}
@media (max-width:820px){.birlikte{grid-template-columns:1fr}}

/* Ekran görüntüleri */
.galeri{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 0 18px;scrollbar-color:var(--cerceve2) transparent}
@media (min-width:900px){.galeri{display:grid;grid-template-columns:repeat(6,1fr);overflow:visible;padding:4px 0 0}.galeri figure{grid-column:span 2}.galeri figure:nth-child(4){grid-column:2/span 2}}
.galeri figure{flex:0 0 min(78%,620px);margin:0;scroll-snap-align:center;border:2px solid var(--cerceve);background:var(--panel)}
.galeri img{width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.galeri figcaption{font:400 15px var(--px);color:var(--soluk);padding:8px 12px}

/* Velilere */
.veli{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:start}
.veli ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.veli li{background:var(--panel);border:2px solid var(--cerceve);padding:14px 16px 14px 52px;position:relative}
.veli li::before{content:"";position:absolute;left:16px;top:18px;width:20px;height:20px;background:var(--yesil);
  clip-path:polygon(0 50%,15% 35%,40% 60%,85% 10%,100% 25%,40% 90%)}
.veli li b{font:700 17px var(--px);color:var(--acik);display:block}
.veli li span{color:var(--soluk);font-size:14px}
.veli .yan{background:linear-gradient(180deg,#1D1650,var(--panel));border:2px solid var(--cerceve2);padding:26px;position:sticky;top:84px}
.yas-buyuk{display:inline-flex;align-items:center;justify-content:center;width:88px;height:88px;background:var(--acik);color:var(--gece);font:700 40px var(--px);margin-bottom:14px}
@media (max-width:900px){.veli{grid-template-columns:1fr}.veli .yan{position:static}}

/* Beta bandı */
.bant{text-align:center;background:linear-gradient(180deg,var(--gece),#1B1450 50%,var(--gece));padding:90px 0}
.bant h2{font-size:clamp(32px,6vw,56px);color:var(--krem);text-shadow:4px 4px 0 var(--pembe)}
.bant p{color:var(--soluk);max-width:560px;margin:0 auto 26px}

/* Alt bilgi */
.alt{border-top:2px solid var(--panel2);padding:40px 0 50px;color:var(--soluk);font-size:13.5px}
.alt .kap{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:28px}
.alt .alt-baslik{font:700 15px var(--px);color:var(--acik);margin:0 0 10px;letter-spacing:.06em}
.alt ul{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.alt a{color:var(--soluk);text-decoration:none}
.alt a:hover{color:var(--krem)}
.alt .karga{font:700 16px var(--px);color:var(--acik)}
.alt .karga b{color:var(--kehribar)}
@media (max-width:760px){.alt .kap{grid-template-columns:1fr}}

/* Form sayfası */
.sayfa{padding:56px 0 80px}
.sayfa .dar{max-width:720px}
.form{background:var(--panel);border:2px solid var(--cerceve);padding:26px;display:grid;gap:20px}
.alan{display:grid;gap:8px}
.alan>label,.alan legend{font:700 16px var(--px);color:var(--acik);padding:0}
.alan small,.not{color:var(--soluk);font-size:13px}
fieldset{border:0;margin:0;padding:0;min-width:0}
input[type=email],input[type=text],select{width:100%;font:15px var(--mono);color:var(--acik);background:var(--gece);border:2px solid var(--cerceve2);padding:12px 12px}
input:focus,select:focus{outline:none;border-color:var(--kehribar)}
.secenekler{display:flex;flex-wrap:wrap;gap:10px}
.secenek{position:relative}
.secenek input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.secenek span{display:block;font:700 16px var(--px);padding:10px 16px;border:2px solid var(--cerceve2);color:var(--soluk);background:var(--gece)}
.secenek input:checked+span{background:var(--kehribar);border-color:var(--kehribar);color:var(--gece)}
.secenek input:focus-visible+span{outline:3px solid var(--camgobegi);outline-offset:2px}
.onay{display:grid;grid-template-columns:24px 1fr;gap:10px;align-items:start;font-size:14px;color:var(--acik)}
.onay input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--kehribar)}
.veli-kutu{border-left:4px solid var(--pembe);padding:4px 0 4px 16px;display:grid;gap:14px}
.veli-kutu[hidden]{display:none}
.sonuc{padding:16px;border:2px solid var(--yesil);background:rgba(61,220,132,.08)}
.sonuc.hata{border-color:var(--pembe);background:rgba(255,46,136,.08)}
.sonuc[hidden]{display:none}

/* Yasal metin */
.yasal h1{font-size:clamp(28px,5vw,42px);margin:0 0 6px}
.yasal .tarih{color:var(--soluk);font-size:13px;margin-bottom:22px}
.yasal .uyari{border:2px dashed var(--kehribar);color:var(--krem);padding:12px 16px;margin-bottom:28px;font-size:14px}
.yasal h2{font-size:24px;margin:34px 0 10px;color:var(--krem)}
.yasal h3{font-size:18px;margin:20px 0 6px}
.yasal p,.yasal li{color:#DCD6F2;font-size:14.5px}
.yasal table{border-collapse:collapse;width:100%;font-size:13.5px;margin:10px 0 18px;display:block;overflow-x:auto}
.yasal th,.yasal td{border:1px solid var(--cerceve);padding:8px 10px;text-align:left;vertical-align:top}
.yasal th{background:var(--panel);font-family:var(--px);font-size:15px}
.yasal-menu{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.yasal-menu a{font:400 15px var(--px);padding:6px 12px;border:2px solid var(--cerceve);color:var(--soluk);text-decoration:none}
.yasal-menu a[aria-current]{background:var(--cerceve);color:var(--acik)}
.ust nav a.dugme,.ust nav a.dugme:hover{color:var(--gece);font:700 15px/1 var(--px)}
.ust nav a.dugme{white-space:nowrap}
@media (max-width:420px){.ust nav a.dugme{font-size:13px;padding:9px 10px}.ust .logo img{height:22px}}
.govde{display:grid;gap:20px}
.govde[disabled]{opacity:.55}
.dugme.kapali{background:var(--panel2);color:var(--soluk);box-shadow:0 0 0 3px var(--cerceve2) inset;cursor:default;transform:none}
.dugme.kapali:hover{transform:none;color:var(--soluk);box-shadow:0 0 0 3px var(--cerceve2) inset}
/* animasyonlar yalnız görünürken (site.js .gorunur ekler) */
.karakter,.armalar img{animation-play-state:paused}
.gorunur .karakter,.gorunur .armalar img{animation-play-state:running}