.title-link[data-v-c970699f] {
  margin-inline-start: 20px;
  text-decoration: none;
}
.vps-title[data-v-c970699f] {
  color: rgb(var(--v-theme-inverseSurface));
  font-weight: bold;
  transition: color .2s;
}
.vps-title[data-v-c970699f]:hover {
  color: rgb(var(--v-theme-primary));
}
.account-button[data-v-c970699f] {
  justify-content: flex-start;
  min-width: 172px;
  max-width: 220px;
}
.account-button[data-v-c970699f] .v-btn__content {
  min-width: 0;
  overflow: hidden;
}
.account-button .text-none[data-v-c970699f] {
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
@media (max-width: 768px) {
.hide-mobile[data-v-c970699f] {
    display: none !important;
}
}
.show-mobile[data-v-c970699f] {
  display: none;
}
@media (max-width: 768px) {
.show-mobile[data-v-c970699f] {
    display: inline-flex !important;
}
}
@media (max-width: 600px) {
.title-link[data-v-c970699f] {
    min-width: 0;
    margin-inline-start: 12px;
}
.vps-title[data-v-c970699f] {
    font-size: 1rem;
}
}

.vue3-progress-bar-container {
  z-index: 999999;
  opacity: 0;
  width: 100%;
  transition: all .5s;
  position: fixed;
  top: 0;
  left: 0;
}

.vue3-progress-bar-container[active="true"] {
  opacity: 1;
  transition: none;
}

.vue3-progress-bar-container .vue3-progress-bar {
  background-color: rgb(var(--v-theme-primary));
  width: 100%;
  height: 2px;
  transition: all .2s;
  transform: translate3d(-100%, 0, 0);
}

:root {
  color: #0f172a;
  background: radial-gradient(circle at 0 0, #3b82f614, #0000 28%), linear-gradient(#f8fafc 0%, #eef4fb 100%);
  font-family: Open Sans, YakuHanJPs, Twemoji, Hiragino Sans, Noto Sans JP, sans-serif;
}

body {
  background: none;
  margin: 0;
  overflow-x: hidden;
}

.kvps-page-view {
  view-transition-name: kvps-page;
}

.kvps-page-view--fade {
  view-transition-name: kvps-server-page;
}

.kvps-page-view--disable-shared .server-shared-transition {
  view-transition-name: none !important;
}

@media (prefers-reduced-motion: no-preference) {
  ::view-transition-old(kvps-page) {
    animation: .24s cubic-bezier(.83, 0, .17, 1) both kvps-page-out;
  }

  ::view-transition-new(kvps-page) {
    animation: .24s cubic-bezier(.83, 0, .17, 1) both kvps-page-in;
  }

  ::view-transition-old(kvps-server-page) {
    animation: .24s cubic-bezier(.83, 0, .17, 1) both kvps-page-fade-out;
  }

  ::view-transition-new(kvps-server-page) {
    animation: .24s cubic-bezier(.83, 0, .17, 1) both kvps-page-fade-in;
  }

  ::view-transition-group(server-preview) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-name) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-status) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-vcpu) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-memory) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-disk) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-hostname) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-os) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-ipv4) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-gateway) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-ipv6) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-group(server-guest-agent) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-preview) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-preview) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-name) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-name) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-status) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-status) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-vcpu) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-vcpu) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-memory) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-memory) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-disk) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-disk) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-hostname) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-hostname) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-os) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-os) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-ipv4) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-ipv4) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-gateway) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-gateway) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-ipv6) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-ipv6) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-old(server-guest-agent) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }

  ::view-transition-new(server-guest-agent) {
    animation-duration: .48s;
    animation-timing-function: cubic-bezier(.34, 1.56, .64, 1);
  }
}

@keyframes kvps-page-out {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-100%);
  }
}

@keyframes kvps-page-in {
  from {
    transform: translateX(100%);
  }

  to {
    transform: translateX(0);
  }
}

@keyframes kvps-page-fade-out {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

@keyframes kvps-page-fade-in {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

html.kvps-console-open, html.kvps-console-open body {
  overscroll-behavior: none;
  overflow: hidden;
}

html {
  overflow-y: auto;
}

html, #app, .v-application, .v-table {
  max-width: 100%;
}

.v-table__wrapper {
  overscroll-behavior-inline: contain;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  overflow-x: auto;
}

.v-table__wrapper > table {
  min-width: max-content;
}

.v-field, .v-field__field, .v-field__input {
  min-width: 0;
}

@media (max-width: 600px) {
  .v-overlay__content {
    max-width: calc(100vw - 24px) !important;
  }

  .v-card-title {
    white-space: normal;
  }

  .v-card-actions {
    flex-wrap: wrap;
  }
}

::-webkit-scrollbar {
  width: 16px;
  height: 16px;
}

::-webkit-scrollbar-thumb {
  background-clip: content-box;
  background-color: rgb(var(--v-theme-primary));
  border: 4px solid #0000;
  border-radius: 8px;
  height: 56px;
}

::-webkit-scrollbar-track {
  background-color: rgb(var(--v-theme-onPrimary));
}

::selection {
  background-color: rgb(var(--v-theme-inversePrimary));
}

.bg-primary {
  background-color: rgb(var(--v-theme-onPrimary)) !important;
}

