.app[data-v-7951109e] .v-main {
  height: 1px;
  overflow: auto;
}

.jlpt-list[data-v-ba8b6736] {
  font-family: monospace;
}

/*
  这里需要用 CSS 来解决。如果在 template 中使用 v-if 的话，会触发 Vue 的 warning
  Slot "extension" invoked outside of the render function
*/
.v-toolbar[data-no-extension='true'][data-v-1f8c4336] .v-toolbar__extension {
  display: none;
}
.v-toolbar[data-no-extension='true'] + .v-main[data-v-1f8c4336] {
  padding-top: 48px;
}

.card[data-v-c3b66938] {
@apply m-2 p-2 border rounded;
}
.jp-simple-text {
  line-height: 1.7;
}
.jp-simple-text u {
  margin: 2px;
}

.option[data-selected='true'][data-v-40524588] {
@apply border border-black;
}
.option[data-correct='true'][data-v-40524588] {
@apply bg-green-300;
}
.option[data-wrong='true'][data-v-40524588] {
@apply bg-red-300;
}

/* 在听力练习中，当前的句子会高亮 */
.jp-text[data-highlight='true'][data-v-5d3e4211] {
  color: rgb(var(--v-theme-secondary));
}
.audio-player[data-v-33cf584b] {
  height: 116px;
}
.audio-player[data-v-33cf584b] .v-card-text {
  padding: 0px 16px 8px;
}
.track[data-v-33cf584b] {
  height: 16px;
}

.header[data-v-73b0e6f2] .v-checkbox-btn .v-label {
  margin-left: -4px;
}
.answer-cell[data-v-73b0e6f2] {
  --size: 24px;
  width: var(--size);
  min-width: var(--size);
  height: var(--size);
  padding: 0;
  border-radius: 50%;
}
.answer-cell[data-current='true'][data-v-73b0e6f2]::after {
  content: '';
  width: 4px;
  height: 4px;
  position: absolute;
  border-radius: 100%;
  left: 10px;
  opacity: 1;
  top: 30px;
  /* background-color: rgb(var(--v--secondary)) !important; */
  /* border: none !important; */
  /* color: rgb(var(--v-theme-on-primary)) !important; */
}

/* practice mode */
.answer-cell[data-practice-mode='true'][data-v-73b0e6f2] {
  background-color: rgb(var(--v-theme-background));
}
.answer-cell[data-answered='true'][data-v-73b0e6f2] {
  border: solid 1px rgb(var(--v-theme-border-secondary));
}

/* view mode */
.answer-cell[data-correct='true'][data-v-73b0e6f2] {
  border: solid 1px rgb(var(--v-theme-success));
  color: rgb(var(--v-theme-success));
}
.answer-cell[data-wrong='true'][data-v-73b0e6f2] {
  border: solid 1px rgb(var(--v-theme-error));
  color: rgb(var(--v-theme-error));
}

.answer-cell[data-current='true'][data-v-f1c76538] {
@apply bg-gray-500 color-white !border-none;
}
/* practice mode */
.answer-cell[data-answered='true'][data-v-f1c76538] {
@apply border border-2 border-gray-300;
}
/* view mode */
.answer-cell[data-correct='true'][data-v-f1c76538] {
@apply border border-2 border-green-300;
}
.answer-cell[data-wrong='true'][data-v-f1c76538] {
@apply border border-2 border-red-300;
}
svg[data-disabled='true'][data-v-f1c76538] {
@apply color-gray-300;
}

.hstack[data-v-fbf60db2] {
  display: flex;
  align-items: center;
}
.flex-wrap[data-v-fbf60db2] {
  flex-wrap: wrap;
}
.gap-4[data-v-fbf60db2] {
  gap: 1rem;
}

.language[data-v-f4283eae] .v-list-item__overlay {
  display: none !important;
}

/* 多个弹窗时轻微位移，便于肉眼区分（不影响 overlay） */
.lc-confirm-dialog[data-v-ef0affe1] .v-overlay__content {
  transform: translateY(var(--lc-offset, 0));
}
.lc-confirm-dialog[data-v-ef0affe1]:nth-child(1) {
  --lc-offset: 0px;
}
.lc-confirm-dialog[data-v-ef0affe1]:nth-child(2) {
  --lc-offset: 6px;
}
.lc-confirm-dialog[data-v-ef0affe1]:nth-child(3) {
  --lc-offset: 12px;
}
/* 继续类推的话也可以用 calc(index * 6px)，这里做几个示例位移即可 */
.subscription-item[data-v-76ccf408] {
  padding: 24px 0;
  text-align: center;
  border-radius: 6px;
  border: 1px solid #e0e0e0;
  flex: 1;
}
.subscription-item.selected[data-v-76ccf408] {
  background-color: rgba(var(--v-theme-primary), 0.2);
  border-color: rgb(var(--v-theme-primary));
}
.subscription-item .title[data-v-76ccf408] {
  font-size: 1rem;
}
.subscription-item .price[data-v-76ccf408] {
  font-family: monospace;
  font-size: 1.3rem;
}
.entry[data-v-fcda4160] {
  height: 100vh;
}
.entry.simulate-mobile[data-v-fcda4160] {
  width: 375px;
  height: 667px;
  margin: auto;
  contain: paint;
  border: solid 1px #eee;
  border-radius: 8px;
  box-shadow: 0 0 10px 0 rgba(0,0,0,0.2);
}
.entry.simulate-mobile[data-v-fcda4160] .v-application__wrap {
  min-height: 100%;
  overflow: auto;
}
body {
  font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue',
    Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji',
    'Noto Color Emoji';
}

.jp-text {
  font-family: Noto Sans JP, sans-serif;
}

::-webkit-scrollbar {
  width: 4px;
  height: 4px;
}
::-webkit-scrollbar-thumb {
  background: #ccc;
  border-radius: 2px;
}
::-webkit-scrollbar-track {
  background: transparent;
}

/* Firefox */
* {
  scrollbar-width: thin;
  scrollbar-color: #ccc transparent;
}

/**
  Animations
*/

/* 自定义 soft-bounce 动画，比 Animate.css 的 bounceIn 更轻 */
@keyframes soft-bounce {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.05); /* 只放大 5% */
  }
  60% {
    transform: scale(0.98); /* 稍微缩小一点 */
  }
  100% {
    transform: scale(1);
  }
}
/* 用于 v-icon */
@keyframes soft-bounce-icon {
  0% {
    transform: scale(1);
  }
  30% {
    transform: scale(1.2);
  }
  60% {
    transform: scale(0.8);
  }
  100% {
    transform: scale(1);
  }
}

/* animate.css 风格的 class */
.animate__softBounce {
  animation-name: soft-bounce;
  animation-duration: 0.3s;
  animation-fill-mode: both;
}
.animate__softBounceIcon {
  animation-name: soft-bounce-icon;
  animation-duration: 0.3s;
  animation-fill-mode: both;
}

/* 扫描动画，用于图片加载 */
.g-shimmer {
  --shimmer-angle: 90deg; /* 90deg=水平；0deg=竖直；可试 100deg 轻微倾斜 */
  --shimmer-width: 32%; /* 高光带宽度（占容器宽度的百分比） */
  --shimmer-brightness: 0.55; /* 高光强度 (0~1) */
  --shimmer-duration: 1.5s; /* 扫光时长 */
}

/* 用伪元素承载“扫光” */
.g-shimmer::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  will-change: background-position;
  background: linear-gradient(
    var(--shimmer-angle),
    transparent 0%,
    rgba(255, 255, 255, var(--shimmer-brightness)) 50%,
    transparent 100%
  );
  background-size: 200% 100%; /* 留足移动空间，避免边缘抖动 */
  background-repeat: no-repeat;
  background-position: -200% 0; /* 从左侧外面开始 */
  animation: shimmer-move var(--shimmer-duration) linear infinite;
  /* 让高光带更窄：用 mask 限定可见宽度（不支持时自动忽略） */
  -webkit-mask: linear-gradient(
    90deg,
    transparent 0,
    #000 calc((100% - var(--shimmer-width)) / 2),
    #000 calc((100% + var(--shimmer-width)) / 2),
    transparent 100%
  );
  mask: linear-gradient(
    90deg,
    transparent 0,
    #000 calc((100% - var(--shimmer-width)) / 2),
    #000 calc((100% + var(--shimmer-width)) / 2),
    transparent 100%
  );
}

@keyframes shimmer-move {
  to {
    background-position: 200% 0;
  } /* 左→右的横扫 */
}

/**
  Utility classes, syntax is the same as Tailwind CSS
*/

.hide-scrollbar {
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE and Edge */
}
.hide-scrollbar::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera */
}

.font-mono {
  font-family: monospace;
}
.h-full {
  height: 100%;
}
.w-full {
  width: 100%;
}
.vstack {
  display: flex;
  flex-direction: column;
}
.p-4 {
  padding: 1rem;
}
.p-2 {
  padding: 0.5rem;
}
.overflow-auto {
  overflow: auto;
}
.line-clamp-1 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  line-clamp: 1;
}
.line-clamp-2 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-clamp: 2;
}
.line-clamp-3 {
  overflow: hidden;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
}
.gap-2 {
  gap: 0.5rem;
}
.gap-4 {
  gap: 1rem;
}
.hstack {
  display: flex;
  align-items: center;
}
.h-1px {
  height: 1px;
}
.whitespace-pre-line {
  white-space: pre-line;
}
.whitespace-nowrap {
  white-space: nowrap;
}

.relative {
  position: relative;
}
.absolute {
  position: absolute;
}
.pointer-events-auto {
  pointer-events: auto !important;
}
.whitespace-nowrap {
  white-space: nowrap;
}
.outline-none {
  outline: none;
}
/** flex */
.flex {
  display: flex;
}
.flex-col {
  flex-direction: column;
}
.items-stretch {
  align-items: stretch;
}
.items-center {
  align-items: center;
}
.align-start {
  align-items: start;
}
.justify-evenly {
  justify-content: space-evenly;
}
.flex-wrap {
  flex-wrap: wrap;
}
.align-baseline {
  align-items: baseline;
}
.flex-1 {
  flex: 1;
}
.shrink-0 {
  flex-shrink: 0;
}

/**
  Vuetify
*/

/* 关闭 v-list-item active 时的灰色背景 */
.v-list-item__overlay,
.v-btn__overlay {
  display: none;
}

.v-btn--disabled .v-btn__overlay {
  display: block;
}