/* Level Up Online - minimal custom CSS (Tailwind-first) */
:root{color-scheme:dark}
*{box-sizing:border-box}
html,body{height:100%}
body{font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,"Apple Color Emoji","Segoe UI Emoji"}

/* Subtle animated background grid (black + green) */
.pf-grid{
  background-image:
    radial-gradient(1000px 600px at 20% 10%, rgba(34,197,94,.18), transparent 60%),
    radial-gradient(900px 500px at 80% 0%, rgba(16,185,129,.14), transparent 55%),
    radial-gradient(900px 600px at 60% 90%, rgba(34,197,94,.10), transparent 60%),
    linear-gradient(to bottom, rgba(0,0,0,1), rgba(0,0,0,.92));
}

/* Better focus visibility */
:focus-visible{outline:none}

/* Prevent iOS zoom on form fields */
input,select,textarea{font-size:16px}
@media (min-width:640px){input,select,textarea{font-size:14px}}

/* Scrollbar (webkit) */
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-thumb{background:rgba(148,163,184,.25);border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:rgba(148,163,184,.4)}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .pf-anim{transition:none !important;animation:none !important}
}

/* Logo fallback (when image fails to load) */
.pf-logo-fallback{display:none;place-items:center;width:100%;height:100%;font-weight:800;letter-spacing:.02em;font-size:12px;color:rgba(226,232,240,.92);background:linear-gradient(135deg, rgba(34,197,94,.28), rgba(16,185,129,.18));}
img[style*="display: none"] + .pf-logo-fallback{display:grid}
.pf-logo-fallback--sm{font-size:10px}

/* Mobile: prevent horizontal scroll from overflow-x UI */
html,body{overflow-x:hidden}