
:root{--snx-safe-top:env(safe-area-inset-top,0px);--snx-safe-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-behavior:smooth;text-size-adjust:100%;-webkit-text-size-adjust:100%}
body{min-width:320px}
img{height:auto}
button,a,input,select,textarea{touch-action:manipulation}
button,a,[role="button"]{min-height:44px}
:focus-visible{outline:3px solid color-mix(in srgb,var(--brand,#57c7ff) 72%,white);outline-offset:2px}
.snx-brand-logo{width:36px;height:36px;object-fit:contain;border-radius:9px;flex:none}
.snx-offline-banner,.snx-session-banner{position:fixed;left:50%;transform:translateX(-50%);z-index:10001;padding:10px 16px;border-radius:0 0 12px 12px;font:600 13px/1.35 system-ui;box-shadow:0 8px 30px rgba(0,0,0,.28);max-width:min(92vw,720px);text-align:center}
.snx-offline-banner{top:0;background:#8b1e2d;color:#fff}
.snx-session-banner{bottom:calc(12px + var(--snx-safe-bottom));background:#172035;color:#fff;border:1px solid rgba(255,255,255,.18);border-radius:12px}
.snx-session-banner button{margin-left:10px;padding:6px 11px;border-radius:8px;background:#fff;color:#111;min-height:34px}
.snx-skeleton{position:relative;overflow:hidden;background:rgba(127,127,127,.12)}
.snx-skeleton:after{content:"";position:absolute;inset:0;transform:translateX(-100%);background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);animation:snx-shimmer 1.3s infinite}
@keyframes snx-shimmer{100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media (max-width:760px){
  body{padding-bottom:var(--snx-safe-bottom)}
  main,.main,.content,.main-content{max-width:100%;overflow-x:hidden}
  .grid,.cards,.stats-grid,.dashboard-grid{grid-template-columns:1fr!important}
  table{display:block;max-width:100%;overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch}
  input,select,textarea{font-size:16px!important}
  .modal,.dialog,[role="dialog"]{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important}
}
@media (max-width:420px){.hide-xs{display:none!important}}
