/* =============================================================================
   LOTOYA NETEWEYÎ — Dijital Kurdistan şans oyunları kurumu
   Full clickable app. Deep-navy + gold (zer) + Newroz flame.
   Ported from the Claude Design handoff (Loto.dc.html) into a vanilla SPA.
   Most layout styles are inline in index.html (faithful to the mockup); this
   file holds globals, animations, view-routing and :hover behaviours.
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Sora:wght@400;500;600;700;800&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600;700&family=Noto+Sans+Arabic:wght@400;500;700&display=swap');

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:#05070F;color:#C7CFE6;font-family:'Inter',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
::selection{background:#F4B41A;color:#1a1200}
body::-webkit-scrollbar{width:11px;height:11px}
body::-webkit-scrollbar-track{background:#070A14}
body::-webkit-scrollbar-thumb{background:#232B4A;border-radius:6px;border:2px solid #070A14}
button{font-family:inherit;border:none;cursor:pointer}
table{font-family:inherit}
a{color:inherit}
img,svg{display:block;max-width:100%}

.num{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums;letter-spacing:-.01em}

/* keyframes */
@keyframes pulse{0%{box-shadow:0 0 0 0 #1FA36399}70%{box-shadow:0 0 0 9px #1FA36300}100%{box-shadow:0 0 0 0 #1FA36300}}
@keyframes slideUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes pop{0%{opacity:0;transform:scale(.4) rotate(-12deg)}60%{transform:scale(1.14)}100%{opacity:1;transform:scale(1)}}
@keyframes floatGlow{0%,100%{opacity:.55;transform:translateY(0)}50%{opacity:.85;transform:translateY(-10px)}}
@keyframes toastin{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
@keyframes spinslow{to{transform:rotate(360deg)}}

/* view routing — only the active view shows */
[data-view]{display:none}
[data-view].active{display:block;animation:slideUp .35s ease both}

/* hover helpers (replace the mockup's style-hover attribute) */
.lift{transition:transform .18s,border-color .18s}
.lift:hover{border-color:#F4B41A88;transform:translateY(-4px)}
.gold-btn{transition:filter .15s}
.gold-btn:hover{filter:brightness(1.07)}
.ghost-btn{transition:color .15s,border-color .15s}
.ghost-btn:hover{border-color:#F4B41A;color:#F4B41A}
.row-hover{transition:background .15s}
.row-hover:hover{background:#111733}
.nav-link{transition:color .15s,background .15s}
.nav-link:hover{color:#F4B41A}
.foot-link:hover{color:#F4B41A}
.wallet-pick:hover{border-color:#F4B41A !important}
.lang-btn{transition:color .12s,background .12s,border-color .12s}

/* responsive */
@media(max-width:880px){
  [data-stack]{grid-template-columns:1fr !important}
  [data-games-grid]{grid-template-columns:1fr !important}
  [data-steps]{grid-template-columns:repeat(2,1fr) !important}
  [data-foot]{grid-template-columns:1fr 1fr !important}
  [data-desk]{display:none !important}
  [data-burger]{display:grid !important}
  [data-deskonly]{display:none !important}
}
@media(min-width:881px){
  [data-burger]{display:none !important}
  [data-mobnav]{display:none !important}
}