html {
  width: 100%;
  max-width: 100%;
  min-height: 100%;
  overflow-x: hidden;
  background: hsl(var(--background, 0 0% 4%));
}

body {
  width: 100%;
  max-width: 100%;
  min-height: 100dvh;
  overflow-x: hidden;
  overscroll-behavior-x: none;
  background: hsl(var(--background, 0 0% 4%));
}

#root {
  width: 100%;
  max-width: 100%;
  min-height: 100dvh;
  overflow-x: clip;
}

.nc-ios body,
.nc-ios #root {
  min-height: var(--nc-viewport-height, 100dvh);
}

.nc-ios header {
  padding-top: max(0.75rem, calc(0.75rem + env(safe-area-inset-top))) !important;
  padding-left: max(1rem, env(safe-area-inset-left)) !important;
  padding-right: max(1rem, env(safe-area-inset-right)) !important;
}

.nc-ios [class~="fixed"][class~="inset-0"] > [class~="absolute"][class~="top-0"] {
  padding-top: max(0.75rem, calc(0.75rem + env(safe-area-inset-top))) !important;
  padding-left: max(1rem, env(safe-area-inset-left)) !important;
  padding-right: max(1rem, env(safe-area-inset-right)) !important;
}

.nc-ios [class~="fixed"][class~="bottom-0"],
.nc-ios nav[class~="fixed"] {
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

.nc-ios input,
.nc-ios textarea,
.nc-ios select {
  font-size: 16px !important;
}

.nc-ios textarea {
  -webkit-text-size-adjust: 100%;
  transform: translateZ(0);
}

.nc-ios input:focus,
.nc-ios textarea:focus,
.nc-ios select:focus {
  scroll-margin-top: calc(5rem + env(safe-area-inset-top));
  scroll-margin-bottom: calc(7rem + env(safe-area-inset-bottom));
}

.nc-ios .overflow-x-auto,
.nc-ios .scrollbar-hide,
.nc-ios [class*="overflow-x-auto"] {
  max-width: 100%;
  overscroll-behavior-x: contain;
  -webkit-overflow-scrolling: touch;
}

.nc-ios [class~="w-[400px]"],
.nc-ios [class~="w-[500px]"] {
  max-width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right));
}

.nc-ios [class~="!w-[calc(100vw-1.5rem)]"] {
  width: calc(100dvw - 1.5rem - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
  max-width: calc(100dvw - 1.5rem - env(safe-area-inset-left) - env(safe-area-inset-right)) !important;
}

.nc-ios .max-w-lg {
  max-width: min(32rem, 100vw);
}

.nc-ios .min-h-screen {
  min-height: var(--nc-viewport-height, 100dvh);
}

.nc-ios .h-screen {
  height: var(--nc-viewport-height, 100dvh);
}

/* Match Live is a full-screen landscape scoreboard. These explicit rules keep
 * the WebView layout stable even when an older generated Tailwind stylesheet
 * does not yet contain one of the arbitrary positioning utilities. */
.nc-live-match {
  width: 100vw;
  min-height: 100vh;
  min-height: 100dvh;
}

.nc-live-match__video {
  width: 100%;
  height: 100%;
}

.nc-live-match__score {
  left: 50%;
  top: 22%;
  transform: translateX(-50%);
}

.nc-live-match .nc-live-match__score-controls {
  position: absolute;
  inset: 0;
  z-index: 10;
  display: block;
  pointer-events: none;
}

.nc-live-match .nc-live-match__score-controls > button {
  position: absolute;
  display: grid;
  margin: 0;
  padding: 0;
  pointer-events: auto;
  transform: translateX(-50%);
  font-size: clamp(1.7rem, 5vh, 2.35rem);
}

.nc-live-match .nc-live-match__score-controls > button:nth-child(1) {
  width: clamp(3.15rem, 11vh, 4.25rem);
  height: clamp(3.15rem, 11vh, 4.25rem);
  bottom: calc(max(0.5rem, env(safe-area-inset-bottom)) + 11.5rem);
}

.nc-live-match .nc-live-match__score-controls > button:nth-child(2) {
  width: clamp(4rem, 15vh, 5.75rem);
  height: clamp(4rem, 15vh, 5.75rem);
  bottom: calc(max(0.5rem, env(safe-area-inset-bottom)) + 7.5rem);
}

.nc-live-match .nc-live-match__score-controls > button:nth-child(3) {
  width: clamp(5.25rem, 20vh, 7.5rem);
  height: clamp(5.25rem, 20vh, 7.5rem);
  bottom: max(0.5rem, env(safe-area-inset-bottom));
  font-size: clamp(2.25rem, 7vh, 3.4rem);
}

.nc-live-match .nc-live-match__score-controls--blue > button {
  border-color: rgb(37 130 255 / 0.95);
  background: rgb(4 35 73 / 0.76);
  box-shadow: 0 0 22px rgb(37 130 255 / 0.28);
}

.nc-live-match .nc-live-match__score-controls--red > button {
  border-color: rgb(255 47 77 / 0.95);
  background: rgb(78 7 17 / 0.76);
  box-shadow: 0 0 22px rgb(255 47 77 / 0.28);
}

.nc-live-match .nc-live-match__score-controls > button:active {
  transform: translateX(-50%) scale(0.96);
}

.nc-live-match .nc-live-match__score-controls--blue > button:nth-child(1) {
  left: calc(max(1rem, env(safe-area-inset-left)) + 2vw);
}

.nc-live-match .nc-live-match__score-controls--blue > button:nth-child(2) {
  left: calc(max(1rem, env(safe-area-inset-left)) + 6vw);
}

.nc-live-match .nc-live-match__score-controls--blue > button:nth-child(3) {
  left: calc(max(1rem, env(safe-area-inset-left)) + 10vw);
}

.nc-live-match .nc-live-match__score-controls--red > button:nth-child(1) {
  left: calc(100% - max(1rem, env(safe-area-inset-right)) - 2vw);
}

.nc-live-match .nc-live-match__score-controls--red > button:nth-child(2) {
  left: calc(100% - max(1rem, env(safe-area-inset-right)) - 6vw);
}

.nc-live-match .nc-live-match__score-controls--red > button:nth-child(3) {
  left: calc(100% - max(1rem, env(safe-area-inset-right)) - 10vw);
}

.nc-live-match__actions {
  right: calc(max(0.75rem, env(safe-area-inset-right)) + 14vw);
  top: max(1.25rem, calc(0.75rem + env(safe-area-inset-top)));
}

@media (min-width: 640px) {
  .nc-live-match__score {
    top: 22%;
  }
}

.nc-ios.nc-keyboard-open [class~="min-h-screen"] {
  min-height: var(--nc-visual-height, var(--nc-viewport-height, 100dvh));
}

#nc-launch-splash {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: max(2rem, env(safe-area-inset-top)) max(1.5rem, env(safe-area-inset-right)) max(2rem, env(safe-area-inset-bottom)) max(1.5rem, env(safe-area-inset-left));
  background: #000;
  opacity: 1;
  transition: opacity 220ms ease;
  pointer-events: none;
  overflow: hidden;
}

#nc-launch-splash img {
  display: block;
  width: clamp(132px, 40vw, 190px);
  max-width: calc(100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 3rem);
  height: auto;
  max-height: calc(100dvh - env(safe-area-inset-top) - env(safe-area-inset-bottom) - 4rem);
  object-fit: contain;
  object-position: center center;
  transform: none;
}

#nc-launch-splash.nc-hidden {
  opacity: 0;
}

#nc-launch-splash.nc-gone {
  display: none;
}

/* Prevent accidental iOS text selection across the app interface. */
.nc-ios body {
  -webkit-user-select: none;
  user-select: none;
}

/* Keep the native caret, selection and copy/paste in text editing fields. */
.nc-ios input,
.nc-ios textarea,
.nc-ios [contenteditable=""],
.nc-ios [contenteditable="true"],
.nc-ios [contenteditable="plaintext-only"] {
  -webkit-user-select: text;
  user-select: text;
}