@import "https://fonts.googleapis.com/css2?family=Crimson+Pro:ital,wght@0,400;0,500;0,600;1,500;1,600&display=swap";
@import "https://fonts.googleapis.com/css2?family=Ubuntu+Mono&display=swap";

html,
body,
#app {
  height: 100%;
  margin: 0;
  padding: 0;
}

html.dark {
  background: #121212;
}

body {
  margin: 0;
  line-height: 1.5;
}

a {
  color: inherit;
  text-decoration: inherit;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

div.main-page {
  font-family:
    "Crimson Pro",
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    Oxygen,
    Ubuntu,
    Cantarell,
    "Fira Sans",
    "Droid Sans",
    "Helvetica Neue",
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

@media (prefers-color-scheme: dark) {
  .highlight {
    color: #7b90d2;
    transition: color 0.3s ease;
  }

  .highlight:hover {
    color: #c1c8f4;
  }
}

@media (prefers-color-scheme: light) {
  .highlight {
    color: #6e75a4;
    transition: color 0.3s ease;
  }

  .highlight:hover {
    color: #113285;
  }
}

.publication-card {
  background: #fff;
  box-shadow: 0 2px 8px rgba(110, 117, 164, 0.1);
  position: relative;
  overflow: hidden;
}

.publication-card:hover {
  box-shadow: 0 8px 32px rgba(110, 117, 164, 0.18);
}

.conf-label {
  background: #113285;
  color: #fff;
  letter-spacing: 0.06em;
  position: absolute;
  transform: translate(-10%) translateY(-50%);
  pointer-events: none;
}

.publication-card:hover ~ .conf-label {
  opacity: 0;
  transform: translate(-110%) translateY(-50%);
}

.conf-dual-label {
  background: #113285;
  color: #fff;
  letter-spacing: 0.06em;
  position: absolute;
  right: 0;
  opacity: 0;
  transform: translate(110%) translateY(-50%);
  pointer-events: none;
}

.publication-card:hover ~ .conf-dual-label {
  opacity: 1;
  transform: translate(10%) translateY(-50%);
}

@media (max-width: 35rem) {
  .phone-hidden {
    display: none;
  }

  .phone-block {
    display: block;
  }

  .phone-flex {
    display: flex;
  }

  .phone-flex-col {
    flex-direction: column;
  }

  .phone-w-full {
    width: 100%;
  }
}

@media (min-width: 35rem) {
  .pc-absolute {
    position: absolute;
  }

  .pc-ml-50 {
    margin-left: 12.5rem;
  }

  .pc-w-50 {
    width: 12.5rem;
  }
}

*,
::before,
::after {
  box-sizing: border-box;
}

.font-sans,
[font-sans=""] {
  font-family:
    ui-sans-serif,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    Roboto,
    "Helvetica Neue",
    Arial,
    "Noto Sans",
    sans-serif;
}

.flex {
  display: flex;
}

.block {
  display: block;
}

.hidden {
  display: none;
}

.inline-flex {
  display: inline-flex;
}

.flex-1 {
  flex: 1 1 0%;
}

.flex-col {
  flex-direction: column;
}

.items-start {
  align-items: flex-start;
}

.items-center {
  align-items: center;
}

.justify-between {
  justify-content: space-between;
}

.gap-3 {
  gap: 0.75rem;
}

.gap-6 {
  gap: 1.5rem;
}

.overflow-hidden {
  overflow: hidden;
}

.overflow-x-hidden {
  overflow-x: hidden;
}

.relative {
  position: relative;
}

.absolute {
  position: absolute;
}

.top-5 {
  top: 1.25rem;
}

.bottom-1 {
  bottom: 0.25rem;
}

.z-20 {
  z-index: 20;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mr-auto {
  margin-right: auto;
}

.mt-2 {
  margin-top: 0.5rem;
}

.mt-5 {
  margin-top: 1.25rem;
}

.mt-10 {
  margin-top: 2.5rem;
}

.mb-2 {
  margin-bottom: 0.5rem;
}

.ml-1 {
  margin-left: 0.25rem;
}

.ml-5 {
  margin-left: 1.25rem;
}

.mr-5 {
  margin-right: 1.25rem;
}

.h-10 {
  height: 2.5rem;
}

.h-full {
  height: 100%;
}

.min-h-40 {
  min-height: 10rem;
}

.min-w-50 {
  min-width: 12.5rem;
}

.w-1\/3 {
  width: 33.3333333333%;
}

.w-50 {
  width: 12.5rem;
}

.w-full {
  width: 100%;
}

.max-w-200 {
  max-width: 50rem;
}

.border {
  border-width: 1px;
  border-style: solid;
}

.border-r {
  border-right-width: 1px;
  border-right-style: solid;
}

.border-gray-200 {
  border-color: rgb(229 231 235);
}

html.dark .dark\:border-gray-700 {
  border-color: rgb(55 65 81);
}

.rounded-md {
  border-radius: 0.375rem;
}

.rounded-sm {
  border-radius: 0.125rem;
}

.bg-white {
  background-color: rgb(255 255 255);
}

html.dark .dark\:bg-gray-800 {
  background-color: rgb(31 41 55);
}

html.dark .dark\:bg-hex-121212 {
  background-color: rgb(18 18 18);
}

.object-contain {
  object-fit: contain;
}

.px-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.px-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.px-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.py-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

[p~="x-4"] {
  padding-left: 1rem;
  padding-right: 1rem;
}

[p~="y-10"] {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.text-left {
  text-align: left;
}

.text-wrap {
  text-wrap: wrap;
}

.text-5xl {
  font-size: 3rem;
  line-height: 1;
}

.text-3xl {
  font-size: 1.875rem;
  line-height: 2.25rem;
}

.text-xl {
  font-size: 1.25rem;
  line-height: 1.75rem;
}

.text-lg {
  font-size: 1.125rem;
  line-height: 1.75rem;
}

.text-base {
  font-size: 1rem;
  line-height: 1.5rem;
}

[text~="center"] {
  text-align: center;
}

[text~="gray-700"],
.text-gray-700 {
  color: rgb(55 65 81);
}

html.dark [text~="dark:gray-200"] {
  color: rgb(229 231 235);
}

html.dark .dark\:text-gray-300 {
  color: rgb(209 213 219);
}

html.dark .dark\:text-white,
.text-white {
  color: rgb(255 255 255);
}

.font-bold {
  font-weight: 700;
}

.font-semibold {
  font-weight: 600;
}

.underline {
  text-decoration-line: underline;
}

.underline-offset-4 {
  text-underline-offset: 4px;
}

.shadow-md {
  box-shadow:
    0 4px 6px -1px rgb(0 0 0 / 0.1),
    0 2px 4px -2px rgb(0 0 0 / 0.1);
}

.hover\:shadow-2xl:hover {
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}

.transition-shadow {
  transition-property: box-shadow;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 0.15s;
}

.duration-300 {
  transition-duration: 0.3s;
}

.i-mdi\:account-school,
.i-mdi\:github,
.i-solar\:letter-bold {
  width: 1.2em;
  height: 1.2em;
  background-color: currentColor;
  color: inherit;
  -webkit-mask: var(--un-icon) no-repeat;
  mask: var(--un-icon) no-repeat;
  -webkit-mask-size: 100% 100%;
  mask-size: 100% 100%;
}

.i-mdi\:account-school {
  --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M16 8c0 2.21-1.79 4-4 4s-4-1.79-4-4l.11-.94L5 5.5L12 2l7 3.5v5h-1V6l-2.11 1.06zm-4 6c4.42 0 8 1.79 8 4v2H4v-2c0-2.21 3.58-4 8-4'/%3E%3C/svg%3E");
}

.i-mdi\:github {
  --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' d='M12 2A10 10 0 0 0 2 12c0 4.42 2.87 8.17 6.84 9.5c.5.08.66-.23.66-.5v-1.69c-2.77.6-3.36-1.34-3.36-1.34c-.46-1.16-1.11-1.47-1.11-1.47c-.91-.62.07-.6.07-.6c1 .07 1.53 1.03 1.53 1.03c.87 1.52 2.34 1.07 2.91.83c.09-.65.35-1.09.63-1.34c-2.22-.25-4.55-1.11-4.55-4.92c0-1.11.38-2 1.03-2.71c-.1-.25-.45-1.29.1-2.64c0 0 .84-.27 2.75 1.02c.79-.22 1.65-.33 2.5-.33s1.71.11 2.5.33c1.91-1.29 2.75-1.02 2.75-1.02c.55 1.35.2 2.39.1 2.64c.65.71 1.03 1.6 1.03 2.71c0 3.82-2.34 4.66-4.57 4.91c.36.31.69.92.69 1.85V21c0 .27.16.59.67.5C19.14 20.16 22 16.42 22 12A10 10 0 0 0 12 2'/%3E%3C/svg%3E");
}

.i-solar\:letter-bold {
  --un-icon: url("data:image/svg+xml;utf8,%3Csvg viewBox='0 0 24 24' width='1.2em' height='1.2em' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill='currentColor' fill-rule='evenodd' d='M3.172 5.172C2 6.343 2 8.229 2 12s0 5.657 1.172 6.828S6.229 20 10 20h4c3.771 0 5.657 0 6.828-1.172S22 15.771 22 12s0-5.657-1.172-6.828S17.771 4 14 4h-4C6.229 4 4.343 4 3.172 5.172M18.576 7.52a.75.75 0 0 1-.096 1.056l-2.196 1.83c-.887.74-1.605 1.338-2.24 1.746c-.66.425-1.303.693-2.044.693s-1.384-.269-2.045-.693c-.634-.408-1.352-1.007-2.239-1.745L5.52 8.577a.75.75 0 0 1 .96-1.153l2.16 1.799c.933.777 1.58 1.315 2.128 1.667c.529.34.888.455 1.233.455s.704-.114 1.233-.455c.547-.352 1.195-.89 2.128-1.667l2.159-1.8a.75.75 0 0 1 1.056.097' clip-rule='evenodd'/%3E%3C/svg%3E");
}