.anki-import-overlay {
  position: fixed;
  inset: 0;
  z-index: calc(var(--overlay-z) + 80);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
  background: rgba(4, 9, 17, 0.72);
  backdrop-filter: blur(7px);
}

.anki-import-overlay.hidden { display: none; }

.anki-import-modal {
  position: relative;
  width: min(680px, 100%);
  max-height: min(90dvh, 860px);
  overflow-y: auto;
  padding: 26px;
  border: 1px solid var(--border);
  border-radius: 22px;
  background: var(--bg-panel-strong);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.5);
}

.anki-import-close {
  position: absolute;
  top: 13px;
  right: 15px;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  color: var(--text-muted);
  font-size: 1.6rem;
  line-height: 1;
  cursor: pointer;
}

.anki-import-close:hover { background: var(--bg-muted); color: var(--text-strong); }
.anki-import-header { padding-right: 34px; }

.anki-import-eyebrow {
  color: var(--accent);
  font-family: var(--font-brand);
  font-size: 0.7rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.anki-import-header h2 {
  margin: 5px 0 4px;
  color: var(--text-strong);
  font-family: var(--font-display);
  font-size: clamp(1.65rem, 4vw, 2.1rem);
  line-height: 1.05;
}

.anki-import-header p,
.anki-import-file-label span:last-child,
.anki-import-file-summary {
  color: var(--text-muted);
  font-size: 0.82rem;
}

.anki-import-header p { margin: 0; }
.anki-import-body { margin-top: 22px; }
.anki-import-dropzone { position: relative; }

.anki-import-file {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  opacity: 0;
}

.anki-import-file:focus-visible + .anki-import-file-label {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
}

.anki-import-file-label {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 180px;
  padding: 26px;
  border: 1px dashed var(--border-strong);
  border-radius: 18px;
  background: var(--bg-inset);
  text-align: center;
  cursor: pointer;
}

.anki-import-file-label__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  margin-bottom: 12px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent);
  font-size: 1.5rem;
}

.anki-import-file-label strong { color: var(--text-strong); }
.anki-import-file-summary { margin: 9px 0 0; text-align: center; }

.anki-import-notice,
.anki-import-info {
  margin: 16px 0 0;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-inset);
  color: var(--text-muted);
  font-size: 0.83rem;
  line-height: 1.45;
}

.anki-import-notice strong,
.anki-import-info strong { color: var(--text-strong); }

.anki-import-info--duplicate {
  border-color: rgba(119, 199, 160, 0.28);
  background: rgba(119, 199, 160, 0.08);
}

.anki-import-error {
  margin: 14px 0 0;
  padding: 11px 13px;
  border: 1px solid rgba(239, 141, 130, 0.32);
  border-radius: 11px;
  background: rgba(239, 141, 130, 0.1);
  color: var(--danger);
  font-size: 0.84rem;
}

.anki-import-error[hidden] { display: none; }

.anki-import-file-pill,
.anki-owned-deck-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
  padding: 9px 12px;
  border-radius: 10px;
  background: var(--bg-muted);
  color: var(--text-muted);
  font-size: 0.78rem;
}

.anki-import-file-pill span:first-child {
  overflow: hidden;
  color: var(--text-strong);
  text-overflow: ellipsis;
  white-space: nowrap;
}

.anki-import-counts {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 9px;
}

.anki-import-count {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 12px 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-inset);
}

.anki-import-count strong {
  color: var(--text-strong);
  font-size: 1.25rem;
  font-variant-numeric: tabular-nums;
}

.anki-import-count span { color: var(--text-muted); font-size: 0.7rem; text-transform: uppercase; }
.anki-import-count--new strong,
.anki-import-count--updated strong { color: var(--accent-strong); }
.anki-import-count--duplicate strong { color: var(--success); }
.anki-import-count--skipped strong { color: var(--text-muted); }

.anki-import-summary,
.anki-import-media-summary,
.anki-import-single-deck,
.anki-owned-deck-description,
.anki-import-empty {
  margin: 12px 0 0;
  color: var(--text-muted);
  font-size: 0.84rem;
}

.anki-import-deck-choices { margin: 18px 0 0; padding: 0; border: 0; }

.anki-import-deck-choices legend,
.anki-import-title-field > span,
.anki-import-preview-list h3 {
  color: var(--text-strong);
  font-size: 0.86rem;
  font-weight: 750;
}

.anki-import-deck-choices > p { margin: 3px 0 9px; color: var(--text-soft); font-size: 0.76rem; }
.anki-import-chip-list { display: flex; flex-wrap: wrap; gap: 8px; }
.anki-import-choice input { position: absolute; opacity: 0; }

.anki-import-choice span {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  color: var(--text-muted);
  font-size: 0.78rem;
  cursor: pointer;
}

.anki-import-choice input:checked + span { border-color: var(--border-strong); background: var(--accent-soft); color: var(--accent-strong); }
.anki-import-choice input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }

.anki-import-title-field { display: flex; flex-direction: column; gap: 7px; margin-top: 18px; }
.anki-import-title-field small { color: var(--text-soft); font-weight: 400; }

.anki-import-title-field input {
  width: 100%;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-inset);
  color: var(--text-strong);
}

.anki-import-title-field input:focus { border-color: var(--border-strong); box-shadow: 0 0 0 3px var(--ring); }
.anki-import-preview-list { margin-top: 20px; }
.anki-import-preview-list h3 { margin: 0 0 8px; }

.anki-import-items,
.anki-import-skipped ul,
.anki-owned-cards { margin: 0; padding: 0; list-style: none; }

.anki-import-items { display: flex; flex-direction: column; gap: 6px; max-height: 240px; overflow-y: auto; }

.anki-import-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--bg-inset);
  font-size: 0.8rem;
}

.anki-import-item__words { display: flex; align-items: center; gap: 7px; min-width: 0; }
.anki-import-item__target { color: var(--text-strong); font-weight: 700; }
.anki-import-item__arrow { color: var(--text-soft); }

.anki-import-result {
  flex: 0 0 auto;
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 0.64rem;
  font-weight: 800;
  text-transform: uppercase;
}

.anki-import-result--duplicate { background: rgba(119, 199, 160, 0.12); color: var(--success); }

.anki-import-skipped {
  margin-top: 16px;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: 12px;
  color: var(--text-muted);
  font-size: 0.8rem;
}

.anki-import-skipped summary { color: var(--text-strong); font-weight: 700; cursor: pointer; }
.anki-import-skipped ul { display: flex; flex-direction: column; gap: 8px; margin-top: 10px; }
.anki-import-skipped li { display: grid; grid-template-columns: minmax(100px, 0.45fr) minmax(0, 1fr); gap: 10px; }
.anki-import-skipped strong { color: var(--text-base); }
.anki-import-skipped p { margin: 10px 0 0; color: var(--text-soft); }

.anki-import-actions {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 22px;
  padding-top: 16px;
  border-top: 1px solid var(--border);
}

.anki-import-actions__spacer { flex: 1 1 auto; }
.anki-import-actions button { min-height: 40px; }

.anki-import-actions button.is-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
}

.anki-import-actions button.is-loading::before {
  content: '';
  width: 15px;
  height: 15px;
  flex: 0 0 auto;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: anki-import-spin 0.7s linear infinite;
}

.anki-import-success { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }

.anki-import-success__mark {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: rgba(119, 199, 160, 0.14);
  color: var(--success);
  font-size: 1.2rem;
}

.anki-import-success div { display: flex; flex-direction: column; }
.anki-import-success div > span { color: var(--text-muted); font-size: 0.78rem; }

.anki-import-loading {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 220px;
  color: var(--text-muted);
}

.anki-import-loading > span {
  width: 34px;
  height: 34px;
  border: 3px solid var(--border);
  border-top-color: var(--accent);
  border-radius: 50%;
  animation: anki-import-spin 0.8s linear infinite;
}

@keyframes anki-import-spin { to { transform: rotate(360deg); } }

.anki-owned-deck-private { color: var(--success); font-weight: 800; text-transform: uppercase; }
.anki-owned-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 14px; }

.anki-owned-card {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--bg-inset);
}

.anki-owned-card__media,
.anki-owned-card__media img,
.anki-owned-card__empty { width: 46px; height: 46px; border-radius: 8px; }
.anki-owned-card__media { overflow: hidden; background: var(--bg-muted); }
.anki-owned-card__media img { display: block; object-fit: cover; }
.anki-owned-card__empty { display: block; background: linear-gradient(135deg, var(--bg-muted), var(--accent-soft)); }
.anki-owned-card__words { display: flex; flex-direction: column; min-width: 0; }

.anki-owned-card__words span,
.anki-owned-card__words strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.anki-owned-card__words span { color: var(--text-muted); font-size: 0.72rem; }
.anki-owned-card__words strong { color: var(--text-strong); font-size: 0.88rem; }

.anki-owned-card__audio {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 31px;
  height: 31px;
  border-radius: 50%;
  background: var(--accent-soft);
  color: var(--accent-strong);
  cursor: pointer;
}

.anki-language-pair {
  margin: 18px 0 0;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
}

.anki-language-pair legend { color: var(--text-strong); font-size: 0.86rem; font-weight: 750; }
.anki-language-pair p { margin: 0 0 10px; color: var(--text-muted); font-size: 0.76rem; }
.anki-language-pair__fields { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); align-items: end; gap: 10px; }
.anki-language-pair__fields label { display: flex; flex-direction: column; gap: 5px; color: var(--text-muted); font-size: 0.72rem; }
.anki-language-pair__fields select { min-height: 40px; padding: 0 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--bg-inset); color: var(--text-strong); }
.anki-save-languages { margin-top: 8px; color: var(--accent-strong); font-size: 0.76rem; font-weight: 700; cursor: pointer; }

.anki-field-mappings { margin-top: 18px; }
.anki-field-mappings > h3 { margin: 0; color: var(--text-strong); font-size: 0.86rem; }
.anki-field-mappings > p { margin: 4px 0 10px; color: var(--text-muted); font-size: 0.76rem; }
.anki-field-mapping { padding: 10px 12px; border: 1px solid var(--border); border-radius: 11px; background: var(--bg-inset); }
.anki-field-mapping + .anki-field-mapping { margin-top: 8px; }
.anki-field-mapping summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--text-strong); font-weight: 750; cursor: pointer; }
.anki-field-mapping > p { margin: 9px 0; color: var(--text-muted); font-size: 0.74rem; }
.anki-field-mapping__confidence { padding: 3px 7px; border-radius: 999px; background: rgba(119, 199, 160, 0.14); color: var(--success); font-size: 0.61rem; font-weight: 800; text-transform: uppercase; }
.anki-field-mapping__confidence--low,
.anki-field-mapping__confidence--medium { background: var(--accent-soft); color: var(--accent-strong); }
.anki-field-mapping__confidence--manual { background: var(--bg-muted); color: var(--text-muted); }
.anki-field-mapping__example { display: flex; align-items: center; gap: 7px; overflow: hidden; padding: 8px 10px; border-radius: 8px; background: var(--bg-muted); }
.anki-field-mapping__example span,
.anki-field-mapping__example strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.anki-field-mapping__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.anki-field-mapping__grid label { display: flex; flex-direction: column; gap: 4px; color: var(--text-muted); font-size: 0.7rem; }
.anki-field-mapping__grid select { width: 100%; min-height: 38px; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-surface); color: var(--text-strong); }

.anki-learning-confirm,
.anki-component-coverage { margin-top: 18px; padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--bg-inset); }
.anki-learning-confirm__step { color: var(--accent-strong); font-size: 0.68rem; font-weight: 850; letter-spacing: 0.05em; text-transform: uppercase; }
.anki-learning-confirm h3,
.anki-component-coverage h3 { margin: 5px 0; color: var(--text-strong); font-size: 1rem; }
.anki-learning-confirm > p,
.anki-component-coverage > p { margin: 5px 0 12px; color: var(--text-muted); font-size: 0.78rem; }
.anki-learning-examples { display: flex; flex-wrap: wrap; gap: 7px; margin: 12px 0 0; }
.anki-learning-examples li { padding: 6px 10px; border-radius: 999px; background: var(--accent-soft); color: var(--text-strong); font-weight: 750; }
.anki-learning-confirmed { display: flex; align-items: center; gap: 10px; margin-top: 16px; color: var(--success); }
.anki-learning-confirmed > span:first-child { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: rgba(119, 199, 160, 0.14); }
.anki-learning-confirmed > span:last-child { display: flex; flex-direction: column; }
.anki-learning-confirmed small { color: var(--text-muted); }
.anki-component-coverage ul { display: grid; gap: 8px; }
.anki-component-row { display: grid; grid-template-columns: minmax(150px, 1fr) repeat(3, minmax(72px, auto)); gap: 10px; align-items: center; padding: 10px; border-radius: 10px; background: var(--bg-surface); }
.anki-component-row > div,
.anki-component-row > span { display: flex; flex-direction: column; }
.anki-component-row small { color: var(--text-muted); font-size: 0.64rem; }
.anki-component-row > span { text-align: center; }
.anki-component-row > p { grid-column: 1 / -1; margin: 0; color: var(--text-muted); font-size: 0.7rem; }

.anki-owned-deck-status,
.anki-owned-card__state {
  padding: 3px 7px;
  border-radius: 999px;
  background: var(--accent-soft);
  color: var(--accent-strong);
  font-size: 0.64rem;
  font-weight: 800;
  text-transform: uppercase;
}

.anki-owned-deck-status--in_collection,
.anki-owned-card__state { background: rgba(119, 199, 160, 0.14); color: var(--success); }
.anki-owned-card__state--ready { background: var(--accent-soft); color: var(--accent-strong); }

.anki-preparation-summary {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--bg-inset);
}

.anki-preparation-summary strong { color: var(--text-strong); }
.anki-preparation-summary span { color: var(--text-muted); font-size: 0.78rem; }

.anki-owned-card { grid-template-columns: auto minmax(0, 1fr) auto auto; }
.anki-owned-card__empty { display: flex; flex-direction: column; align-items: center; justify-content: center; color: var(--text-soft); }
.anki-owned-card__empty small { font-size: 0.52rem; line-height: 1; text-align: center; }
.anki-owned-card__find { color: var(--accent-strong); font-size: 0.72rem; font-weight: 750; cursor: pointer; }
.anki-owned-card__picture-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.anki-owned-card__upload { color: var(--text-muted); font-size: 0.7rem; font-weight: 700; cursor: pointer; }
.anki-owned-card__upload input { position: absolute; width: 1px; height: 1px; overflow: hidden; opacity: 0; pointer-events: none; }
.anki-owned-card__audio-upload { padding: 5px 8px; border-radius: 8px; background: var(--accent-soft); color: var(--accent-strong); }
.anki-owned-card__component-editor { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)) auto; gap: 7px; padding-top: 8px; border-top: 1px solid var(--border); }
.anki-owned-card__component-editor label { display: flex; flex-direction: column; gap: 3px; color: var(--text-muted); font-size: 0.66rem; }
.anki-owned-card__component-editor input { min-height: 34px; padding: 0 8px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-surface); color: var(--text-strong); }
.anki-owned-card__component-editor button { align-self: end; min-height: 34px; padding: 0 10px; border-radius: 8px; background: var(--accent-soft); color: var(--accent-strong); font-weight: 750; cursor: pointer; }

.anki-image-picker { grid-column: 1 / -1; padding-top: 8px; border-top: 1px solid var(--border); }
.anki-image-picker > p { margin: 0 0 8px; color: var(--text-muted); font-size: 0.74rem; }
.anki-image-picker__grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 6px; }
.anki-image-picker__grid button { overflow: hidden; aspect-ratio: 1; border: 2px solid transparent; border-radius: 8px; cursor: pointer; }
.anki-image-picker__grid button:hover,
.anki-image-picker__grid button:focus-visible { border-color: var(--accent); }
.anki-image-picker__grid img { width: 100%; height: 100%; object-fit: cover; }
.anki-show-more { display: block; margin: 14px auto 0; color: var(--accent-strong); font-weight: 700; cursor: pointer; }

@media (max-width: 759px) {
  .library-section-head--actions { align-items: stretch; flex-direction: column; }
  .anki-import-open { width: 100%; }
  .library-grid--decks,
  .anki-owned-cards { grid-template-columns: 1fr; }
  .library-owned-empty { align-items: flex-start; flex-direction: column; gap: 3px; }
  .anki-import-overlay { align-items: flex-end; padding: 0; }
  .anki-import-modal { width: 100%; max-height: 94dvh; padding: 22px 18px; border-radius: 20px 20px 0 0; }
  .anki-import-counts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .anki-import-actions { flex-wrap: wrap; }
  .anki-import-actions button { flex: 1 1 auto; }
  .anki-import-skipped li { grid-template-columns: 1fr; gap: 2px; }
  .anki-language-pair__fields { grid-template-columns: 1fr; }
  .anki-language-pair__fields > span { display: none; }
  .anki-field-mapping__grid { grid-template-columns: 1fr; }
  .anki-component-row { grid-template-columns: repeat(3, 1fr); }
  .anki-component-row > div,
  .anki-component-row > p { grid-column: 1 / -1; }
  .anki-preparation-summary { flex-direction: column; }
  .anki-image-picker__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .anki-owned-card { grid-template-columns: auto minmax(0, 1fr) auto; }
  .anki-owned-card__audio { grid-column: 3; }
  .anki-owned-card__component-editor { grid-template-columns: 1fr; }
}
