/* Yilbasi temasi - hafif ve sade. Sadece JS tarafindan <html class="yilbasi"> eklenirse devreye girer. */
html.yilbasi body::before{
  content:"";position:fixed;top:0;left:0;right:0;height:5px;z-index:9999;pointer-events:none;
  background:
    radial-gradient(circle at 10px 2.5px,#e53935 0 2px,transparent 2.6px) 0 0/40px 5px repeat-x,
    radial-gradient(circle at 20px 2.5px,#fdd835 0 2px,transparent 2.6px) 0 0/40px 5px repeat-x,
    radial-gradient(circle at 30px 2.5px,#43a047 0 2px,transparent 2.6px) 0 0/40px 5px repeat-x,
    radial-gradient(circle at 0 2.5px,#1e88e5 0 2px,transparent 2.6px) 0 0/40px 5px repeat-x;
  animation:yb-lights 3s ease-in-out infinite alternate;
}
@keyframes yb-lights{from{opacity:.55}to{opacity:1}}
html.yilbasi body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.28;
  background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22700%22 height=%22700%22 viewBox=%220 0 700 700%22%3E%3Cg transform=%22translate%2860 70%29 rotate%28-20%29 scale%281%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%232e9d4f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28330 40%29 rotate%2825%29 scale%280.9%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%23d32f2f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28560 150%29 rotate%28-35%29 scale%281.1%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%232e9d4f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28150 300%29 rotate%2830%29 scale%281%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%23d32f2f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28430 330%29 rotate%28-15%29 scale%280.9%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%232e9d4f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%2840 520%29 rotate%2815%29 scale%281%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%232e9d4f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28300 560%29 rotate%28-30%29 scale%281.1%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%23d32f2f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3Cg transform=%22translate%28590 480%29 rotate%2820%29 scale%280.9%29%22%3E%3Cpath d=%22M0 60V10a14 14 0 0 1 28 0v8%22 fill=%22none%22 stroke=%22%23fff%22 stroke-width=%229%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M0 56V10a14 14 0 0 1 28 0v6%22 fill=%22none%22 stroke=%22%232e9d4f%22 stroke-width=%229%22 stroke-dasharray=%225 6%22/%3E%3C/g%3E%3C/svg%3E") 0 0/560px 560px repeat;
}
#yb-snow{position:fixed;inset:0;width:100%;height:100%;z-index:9998;pointer-events:none}
@media (prefers-reduced-motion:reduce){
  html.yilbasi body::before{animation:none;opacity:.8}
  #yb-snow{display:none}
}
