@font-face{font-family:'Baloo 2';font-weight:800;font-display:swap;src:url(/yazi/baloo2-800.woff2) format('woff2')}
@font-face{font-family:'Baloo 2';font-weight:800;font-display:swap;src:url(/yazi/baloo2-800-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF}
@font-face{font-family:'Baloo 2';font-weight:500;font-display:swap;src:url(/yazi/baloo2-500.woff2) format('woff2')}
@font-face{font-family:'Baloo 2';font-weight:500;font-display:swap;src:url(/yazi/baloo2-500-ext.woff2) format('woff2');unicode-range:U+0100-024F,U+1E00-1EFF}

:root{
  --gok:#3EC1F3; --gunes:#FFD23F; --pembe:#FF6FB5; --cimen:#5BD16B; --uzum:#8B5CF6; --portakal:#FF8A3D;
  --murekkep:#1B1F3B; --zemin:#EAF6FF; --kart:#fff; --golge:0 6px 0 rgba(27,31,59,.10),0 10px 24px rgba(27,31,59,.10);
  --yaricap:20px; --karo:132px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:'Baloo 2',ui-rounded,'Arial Rounded MT Bold',system-ui,sans-serif;font-weight:500;color:var(--murekkep);
  background:var(--zemin);
  background-image:radial-gradient(circle at 12px 12px,rgba(62,193,243,.18) 3px,transparent 3.5px);background-size:44px 44px;
  min-height:100vh;display:flex;flex-direction:column}
a{color:inherit}
main{width:100%;max-width:1440px;margin:0 auto;padding:8px 16px 40px;flex:1}
h1,h2,h3{font-weight:800;line-height:1.15}

/* üst bar */
.ust{position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 16px;background:rgba(255,255,255,.92);backdrop-filter:blur(8px);box-shadow:0 4px 0 rgba(27,31,59,.06)}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;flex-shrink:0}
.logo-svg{width:42px;height:42px;transition:transform .2s}
.logo:hover .logo-svg{transform:rotate(-10deg) scale(1.08)}
.logo-yazi{font-weight:800;font-size:28px;letter-spacing:-.5px;line-height:1}
.logo-yazi b{color:var(--pembe)}.logo-yazi i{font-style:normal;color:var(--gok)}
.arama{flex:1;display:flex;max-width:520px;margin:0 auto;background:var(--zemin);border-radius:999px;border:3px solid transparent;transition:border-color .15s}
.arama:focus-within{border-color:var(--gok)}
.arama input{flex:1;min-width:0;border:0;background:transparent;font:inherit;font-size:17px;padding:8px 16px;outline:0}
.arama button{border:0;background:transparent;font-size:18px;padding:0 14px;cursor:pointer}
.dil{flex-shrink:0;text-decoration:none;font-weight:800;background:var(--gunes);padding:6px 14px;border-radius:999px;box-shadow:0 3px 0 #d9a400}

/* kategori şeridi */
.kat-serit{display:flex;gap:10px;overflow-x:auto;padding:12px 16px;scrollbar-width:none;max-width:1440px;margin:0 auto;width:100%}
.kat-serit::-webkit-scrollbar{display:none}
.kat-serit a{flex-shrink:0;display:flex;align-items:center;gap:6px;text-decoration:none;font-weight:800;font-size:15px;background:#fff;border-radius:999px;padding:6px 14px 6px 8px;box-shadow:0 3px 0 var(--r);transition:transform .12s}
.kat-serit a span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--r);font-size:16px}
.kat-serit a:hover{transform:translateY(-2px)}

/* ızgara ve karolar */
.giris-baslik{font-size:clamp(22px,3.2vw,32px);margin:8px 0 4px}
.satir{margin:18px 0}
.satir h2{font-size:22px;margin:0 0 10px}
.satir h2 a{text-decoration:none}
.satir h2 a small{color:var(--r);font-size:26px}
.izgara{display:grid;grid-template-columns:repeat(auto-fill,minmax(var(--karo),1fr));grid-auto-flow:dense;gap:14px}
.karo{position:relative;display:block;aspect-ratio:1;border-radius:var(--yaricap);overflow:hidden;background:#fff;box-shadow:var(--golge);text-decoration:none;transition:transform .15s,box-shadow .15s;border:4px solid #fff}
.karo.buyuk{grid-column:span 2;grid-row:span 2}
.karo img{width:100%;height:100%;object-fit:cover;display:block}
.kapak-yedek{display:grid;place-items:center;width:100%;height:100%;padding:10px;text-align:center;font-weight:800;font-size:18px;color:#fff;background:var(--r);text-shadow:0 2px 0 rgba(0,0,0,.2)}
.karo-ad{position:absolute;left:0;right:0;bottom:0;padding:18px 8px 6px;font-weight:800;font-size:15px;color:#fff;text-align:center;background:linear-gradient(transparent,rgba(27,31,59,.78));opacity:0;transform:translateY(6px);transition:.15s}
.karo:hover,.karo:focus-visible{transform:translateY(-4px) rotate(-1deg) scale(1.03);box-shadow:0 10px 0 rgba(27,31,59,.10),0 16px 30px rgba(27,31,59,.18);z-index:2}
.karo:hover .karo-ad,.karo:focus-visible .karo-ad{opacity:1;transform:none}
@media (hover:none){.karo-ad{opacity:1;transform:none;font-size:13px;padding-top:14px}}
.karo.buyuk .karo-ad{font-size:20px}

/* oyun sayfası */
.kirinti{font-size:14px;margin:4px 0 10px;opacity:.8}
.kirinti a{text-decoration:none;font-weight:800}
.oyun-duzen{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;align-items:start}
.oynatici{position:relative;width:100%;background:var(--murekkep);border-radius:24px;overflow:hidden;box-shadow:var(--golge);border:5px solid #fff}
.oynatici.yatay{aspect-ratio:16/9}
.oynatici.dikey{height:min(78vh,820px)}
.oynatici iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
.oynatici-kapak{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;cursor:pointer;
  background:radial-gradient(circle at 50% 35%,color-mix(in srgb,var(--r) 75%,#fff),var(--r) 55%,color-mix(in srgb,var(--r) 60%,#1B1F3B))}
.oynatici-kapak img{width:min(200px,38%);height:auto;aspect-ratio:1;object-fit:cover;border-radius:28px;border:6px solid #fff;box-shadow:0 10px 0 rgba(0,0,0,.15);animation:zipla 1.6s ease-in-out infinite}
.oynatici-kapak h1{margin:0;color:#fff;font-size:clamp(26px,4vw,42px);text-shadow:0 4px 0 rgba(0,0,0,.2);text-align:center;padding:0 12px}
.oyna-btn{font:inherit;font-weight:800;font-size:clamp(22px,3vw,30px);color:#3a2300;background:var(--gunes);border:0;border-radius:999px;padding:.35em 1.6em;box-shadow:0 7px 0 #d9a400;cursor:pointer;transition:transform .1s}
.oyna-btn:hover{transform:scale(1.06)}
.oyna-btn:active{transform:translateY(4px);box-shadow:0 3px 0 #d9a400}
@keyframes zipla{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-12px) rotate(3deg)}}
.oynatici-arac{display:flex;align-items:center;gap:12px;justify-content:space-between;margin:10px 4px}
.oynatici-arac .kisa{font-size:16px}
.tam-ekran{font:inherit;font-weight:800;border:0;background:#fff;border-radius:999px;padding:6px 16px;box-shadow:0 3px 0 rgba(27,31,59,.15);cursor:pointer;flex-shrink:0}
.bilgi{background:#fff;border-radius:24px;padding:8px 24px 20px;box-shadow:var(--golge);margin-top:16px;font-size:17px;line-height:1.6}
.bilgi h2{font-size:22px;margin:20px 0 6px;color:var(--uzum)}
.bilgi details{background:var(--zemin);border-radius:14px;padding:8px 14px;margin:8px 0}
.bilgi summary{font-weight:800;cursor:pointer}
.etiketler{display:flex;flex-wrap:wrap;gap:8px}
.etiketler a{text-decoration:none;background:var(--zemin);border-radius:999px;padding:2px 12px;font-weight:800;font-size:15px}
.oyun-yan h2{font-size:20px;margin:0 0 10px}
.oyun-yan .izgara{--karo:96px;gap:10px}
.metin{max-width:820px;margin:10px auto}
.metin h1{color:var(--pembe)}
.kat-baslik{background:var(--r);color:#fff;border-radius:24px;padding:14px 24px;margin-bottom:18px;box-shadow:var(--golge)}
.kat-baslik h1{margin:4px 0;font-size:clamp(26px,4vw,38px);text-shadow:0 3px 0 rgba(0,0,0,.15)}
.kat-baslik p{margin:0 0 6px;font-size:17px;max-width:60em}
.bos{font-size:18px;text-align:center;padding:30px}
.reklam{margin:16px 0;text-align:center;min-height:100px}
.reklam span{display:block;font-size:11px;opacity:.55;letter-spacing:.08em;text-transform:uppercase}

/* tam ekran ve oyun modu (mobil) */
.oynatici:fullscreen{border:0;border-radius:0;height:100%;aspect-ratio:auto}
body.oyun-acik{overflow:hidden}
body.oyun-acik .oynatici.mobil-tam{position:fixed;inset:0;z-index:100;height:100%;border:0;border-radius:0;aspect-ratio:auto}
.kapat-btn{display:none;position:absolute;top:8px;left:8px;z-index:3;width:42px;height:42px;border:0;border-radius:50%;background:rgba(255,255,255,.9);font-size:20px;cursor:pointer}
.mobil-tam .kapat-btn{display:block}

.alt{background:var(--murekkep);color:#fff;padding:22px 16px;text-align:center;margin-top:30px}
.alt nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin-bottom:8px}
.alt a{text-decoration:none;font-weight:800;color:var(--gunes)}
.alt p{margin:0;opacity:.75;font-size:14px}

@media (max-width:980px){.oyun-duzen{grid-template-columns:1fr}.oyun-yan .izgara{--karo:110px}}
@media (max-width:640px){
  :root{--karo:104px;--yaricap:16px}
  .ust{flex-wrap:wrap;gap:8px;padding:8px 12px}
  .arama{order:3;flex-basis:100%;max-width:none}
  .logo-yazi{font-size:24px}.logo-svg{width:36px;height:36px}
  .dil{margin-left:auto}
  main{padding:4px 12px 30px}
  .izgara{gap:10px}
  .oynatici.dikey{height:auto;aspect-ratio:3/4}
  .bilgi{padding:6px 16px 16px}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}