/* =============================================================
   Gjuha.al — Stilet e reja (v2)
   Fjalori, frazat, praktika, progresi dhe rishikimi i kuizit.
   Ngarkohet pas style.css dhe mbështetet te variablat e tij.
   ============================================================= */

/* ── Ndihmësa ────────────────────────────────────────────────── */
.skip-link {
  position: absolute;
  top: .5rem;
  left: .5rem;
  z-index: 2000;
  background: var(--dark);
  color: #fff;
  padding: .5rem 1rem;
  border-radius: 8px;
}

.streak-badge {
  background: rgba(255, 255, 255, .15);
  color: #fff;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 50px;
  font-weight: 700;
}

/* ── Koka e fjalorit ─────────────────────────────────────────── */
.dict-hero {
  background: linear-gradient(135deg, var(--dark), var(--dark2));
  padding: 3.5rem 0 2.75rem;
}
.dict-hero-title { font-size: clamp(1.75rem, 4vw, 2.5rem); }

.dict-search-form { width: 100%; }
.dict-search-row  { display: flex; gap: .5rem; flex-wrap: wrap; }

.dict-search-input-wrap { position: relative; flex: 1 1 260px; min-width: 0; }
.dict-search-icon {
  position: absolute;
  left: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: #9aa0b5;
  pointer-events: none;
}
.dict-search-input { padding-left: 2.75rem !important; border-radius: 12px; border: none; }
.dict-select       { flex: 0 1 200px; border-radius: 12px; border: none; }
.dict-search-btn   { border-radius: 12px; font-weight: 700; padding-inline: 1.75rem; }

.dict-filters { display: flex; gap: .5rem; flex-wrap: wrap; margin-top: .75rem; }
.dict-filters .form-select { max-width: 190px; border-radius: 10px; border: none; }

/* Sugjerimet live */
.dict-suggest {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(0, 0, 0, .25);
  overflow: hidden auto;
  z-index: 1050;
  max-height: 22rem;
}
.dict-suggest-item {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: .15rem .75rem;
  padding: .65rem 1rem;
  text-decoration: none;
  color: var(--text);
  border-bottom: 1px solid #f0f0f5;
}
.dict-suggest-item:last-child { border-bottom: none; }
.dict-suggest-item:hover      { background: var(--bg-light); }
.dsi-word  { font-weight: 700; }
.dsi-phon  { grid-column: 1; font-size: .8rem; color: var(--text-light); font-style: italic; }
.dsi-trans { grid-column: 1; font-size: .9rem; color: var(--text-light); }
.dsi-level {
  grid-row: 1 / span 3;
  grid-column: 2;
  align-self: center;
  font-size: .7rem;
  font-weight: 700;
  color: var(--primary);
  background: rgba(108, 99, 255, .1);
  border-radius: 6px;
  padding: .15rem .4rem;
  height: fit-content;
}

/* Shfletimi A–Z */
.dict-alphabet { display: flex; flex-wrap: wrap; gap: .25rem; align-items: center; }
.dict-alphabet-label { font-size: .85rem; color: var(--text-light); margin-right: .35rem; }
.dict-letter {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: #fff;
  border: 1px solid #e6e6ef;
  color: var(--text);
  text-decoration: none;
  font-size: .85rem;
  font-weight: 600;
  transition: var(--transition);
}
.dict-letter:hover   { border-color: var(--primary); color: var(--primary); }
.dict-letter.active  { background: var(--primary); border-color: var(--primary); color: #fff; }
.dict-letter-clear   { color: var(--secondary); }

/* Kartela e fjalës */
.dict-card {
  background: #fff;
  border: 1px solid #ececf5;
  border-radius: var(--radius);
  padding: 1rem 1.1rem;
  height: 100%;
  display: flex;
  flex-direction: column;
  gap: .4rem;
  transition: var(--transition);
}
.dict-card:hover { box-shadow: var(--shadow); border-color: rgba(108, 99, 255, .35); }
.dict-card-head  { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; }
.dict-card-word {
  font-size: 1.15rem;
  font-weight: 800;
  color: var(--dark);
  text-decoration: none;
}
.dict-card-word:hover { color: var(--primary); }
.dict-gender    { display: block; font-size: .72rem; color: var(--text-light); }
.dict-card-actions { display: flex; gap: .25rem; flex-shrink: 0; }

.dict-icon-btn {
  background: none;
  border: 1px solid #e6e6ef;
  border-radius: 8px;
  padding: .15rem .45rem;
  font-size: .85rem;
  line-height: 1.4;
  cursor: pointer;
  transition: var(--transition);
}
.dict-icon-btn:hover          { background: var(--bg-light); border-color: var(--primary); }
.dict-icon-btn.is-added       { background: #e8f5e9; border-color: #27ae60; color: #2e7d32; }
.dict-icon-btn.is-unsupported { opacity: .4; cursor: not-allowed; }

.dict-phonetics { display: flex; gap: .5rem; flex-wrap: wrap; font-size: .8rem; }
.dict-phon-sq   { color: var(--primary); font-weight: 600; }
.dict-phon-ipa  { color: var(--text-light); font-family: ui-monospace, Menlo, Consolas, monospace; }

.dict-card-trans { font-size: 1rem; color: var(--text); font-weight: 500; }
.dict-card-ex {
  font-size: .85rem;
  color: var(--text-light);
  border-left: 3px solid rgba(108, 99, 255, .25);
  padding-left: .6rem;
}
.dict-card-foot {
  display: flex;
  gap: .35rem;
  flex-wrap: wrap;
  align-items: center;
  margin-top: auto;
  padding-top: .5rem;
}
.dict-flag { font-size: .9rem; }
.dict-tag {
  font-size: .7rem;
  font-weight: 600;
  padding: .15rem .45rem;
  border-radius: 6px;
  background: #f2f2f8;
  color: var(--text-light);
}
.dict-tag-level    { background: rgba(108, 99, 255, .12); color: var(--primary); }
.dict-tag-link     { text-decoration: none; }
.dict-tag-link:hover { background: rgba(108, 99, 255, .18); color: var(--primary); }

/* Fjala e ditës */
.dict-wotd {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
  border: none;
  border-radius: var(--radius);
}
.dict-wotd-label { font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; opacity: .85; }
.dict-wotd-word  { font-size: 1.6rem; font-weight: 800; margin-top: .25rem; }
.dict-wotd-phon  { font-size: .85rem; opacity: .9; }
.dict-wotd-trans { font-size: 1rem; margin-top: .35rem; }
.dict-wotd-ex    { font-size: .82rem; opacity: .9; margin-top: .6rem; }
.dict-wotd-ex .text-muted { color: rgba(255, 255, 255, .7) !important; }

.dict-cat-list { max-height: 26rem; overflow-y: auto; }
.dict-cat-list .list-group-item { border: none; border-bottom: 1px solid #f2f2f8; font-size: .9rem; }
.dict-cat-list .list-group-item.active { background: var(--primary); border-color: var(--primary); }

.dict-deck-card { border: 2px dashed rgba(108, 99, 255, .3); background: var(--bg-light); }

/* ── Faqja e një fjale ───────────────────────────────────────── */
.word-hero {
  background: linear-gradient(135deg, var(--lang-color, var(--primary)) 18%, var(--dark2));
  padding: 2rem 0 2.5rem;
  color: #fff;
}
.word-hero .breadcrumb-item,
.word-hero .breadcrumb-item a       { color: rgba(255, 255, 255, .75); }
.word-hero .breadcrumb-item.active  { color: #fff; }
.word-hero .breadcrumb-item + .breadcrumb-item::before { color: rgba(255, 255, 255, .45); }

.word-main       { display: flex; gap: 2rem; flex-wrap: wrap; align-items: flex-start; }
.word-main-left  { flex: 1 1 320px; }
.word-main-right {
  flex: 0 1 280px;
  background: rgba(255, 255, 255, .12);
  border-radius: var(--radius);
  padding: 1.25rem;
}
.word-flag   { margin-bottom: .5rem; }
.word-title  { font-size: clamp(2rem, 6vw, 3rem); font-weight: 800; margin: 0; }
.word-gender { opacity: .8; font-size: .95rem; }
.word-phonetics { display: flex; gap: 1.5rem; flex-wrap: wrap; margin-top: .75rem; }
.word-phon-label {
  display: block;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .08em;
  opacity: .7;
}
.word-phon-sq  { font-size: 1.15rem; font-weight: 700; }
.word-phon-ipa { font-size: 1.05rem; font-family: ui-monospace, Menlo, Consolas, monospace; opacity: .9; }

.word-translation-label { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; opacity: .7; }
.word-translation { font-size: 1.5rem; font-weight: 700; margin: .25rem 0 .75rem; }
.word-tags { display: flex; gap: .35rem; flex-wrap: wrap; }
.word-tags .dict-tag       { background: rgba(255, 255, 255, .2); color: #fff; }
.word-tags .dict-tag-level { background: rgba(255, 255, 255, .9); color: var(--dark); }

.word-example    { font-size: 1.15rem; margin-bottom: .35rem; }
.word-example-sq { color: var(--text-light); margin: 0; }

.word-related {
  display: flex;
  align-items: center;
  gap: .5rem;
  padding: .6rem .8rem;
  border: 1px solid #ececf5;
  border-radius: 10px;
  text-decoration: none;
  color: var(--text);
  transition: var(--transition);
}
.word-related:hover { border-color: var(--primary); background: var(--bg-light); }
.word-related-word  { font-weight: 700; }
.word-related-trans { color: var(--text-light); font-size: .88rem; flex: 1; }

/* ── Frazat ──────────────────────────────────────────────────── */
.phrases-hero {
  background: linear-gradient(135deg, var(--dark), var(--dark2));
  padding: 3rem 0;
}
.phrase-group-title { border-bottom: 2px solid #ececf5; padding-bottom: .5rem; }
.phrase-card {
  background: #fff;
  border: 1px solid #ececf5;
  border-radius: var(--radius);
  padding: 1rem 1.1rem;
  height: 100%;
  transition: var(--transition);
}
.phrase-card:hover  { box-shadow: var(--shadow); }
.phrase-card-top    { display: flex; align-items: center; gap: .4rem; flex-wrap: wrap; margin-bottom: .6rem; }
.phrase-card-top .badge { font-size: .68rem; }
.phrase-text        { font-size: 1.1rem; font-weight: 700; color: var(--dark); }
.phrase-phonetic    { font-size: .85rem; color: var(--primary); margin-top: .15rem; }
.phrase-translation { font-size: 1rem; margin-top: .5rem; }
.phrase-literal     { font-size: .78rem; color: var(--text-light); font-style: italic; margin-top: .25rem; }
.phrase-cta         { background: var(--bg-light); border-color: rgba(108, 99, 255, .2) !important; }

/* ── Praktika ────────────────────────────────────────────────── */
.practice-hero {
  background: linear-gradient(135deg, var(--dark), var(--dark2));
  padding: 2.5rem 0;
}
.practice-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: .5rem; }
.practice-stat {
  background: rgba(255, 255, 255, .1);
  border-radius: 10px;
  padding: .65rem .35rem;
  text-align: center;
}
.practice-stat-num   { font-size: 1.5rem; font-weight: 800; color: #fff; line-height: 1.1; }
.practice-stat-label { font-size: .66rem; color: rgba(255, 255, 255, .7); }

.practice-mode {
  width: 100%;
  height: 100%;
  background: #fff;
  border: 2px solid #ececf5;
  border-radius: var(--radius);
  padding: 1.1rem .85rem;
  text-align: center;
  cursor: pointer;
  transition: var(--transition);
  display: flex;
  flex-direction: column;
  gap: .3rem;
}
.practice-mode:hover {
  border-color: var(--primary);
  transform: translateY(-3px);
  box-shadow: var(--shadow);
}
.practice-mode-icon { font-size: 1.9rem; }
.practice-mode-name { font-weight: 700; color: var(--dark); }
.practice-mode-desc { font-size: .75rem; color: var(--text-light); line-height: 1.35; }

.practice-session-bar { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.practice-progress {
  flex: 1;
  height: 8px;
  background: #ececf5;
  border-radius: 50px;
  overflow: hidden;
}
.practice-progress-fill {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, var(--primary), var(--accent));
  border-radius: 50px;
  transition: width .35s ease;
}
.practice-counter { font-size: .85rem; color: var(--text-light); font-variant-numeric: tabular-nums; }

.practice-stage   { min-height: 22rem; }
.practice-loading { text-align: center; padding: 4rem 1rem; }

.practice-info      { text-align: center; padding: 1.25rem; }
.practice-info-icon { font-size: 2rem; margin-bottom: .5rem; }

/* Kartela që kthehet */
.fc-card {
  perspective: 1400px;
  max-width: 34rem;
  margin: 0 auto;
  cursor: pointer;
  height: 20rem;
}
.fc-inner {
  position: relative;
  width: 100%;
  height: 100%;
  transition: transform .55s cubic-bezier(.4, .2, .2, 1);
  transform-style: preserve-3d;
}
.fc-card.is-flipped .fc-inner { transform: rotateY(180deg); }
.fc-face {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  border-radius: 18px;
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
  text-align: center;
  overflow-y: auto;
}
.fc-front { background: linear-gradient(135deg, var(--primary), var(--primary-dark)); color: #fff; }
.fc-back  { background: #fff; border: 2px solid var(--primary); transform: rotateY(180deg); }
.fc-lang  { font-size: .7rem; letter-spacing: .12em; opacity: .75; }
.fc-word  { font-size: clamp(1.75rem, 6vw, 2.6rem); font-weight: 800; }
.fc-phon  { font-size: 1rem; opacity: .85; }
.fc-speak {
  background: rgba(255, 255, 255, .2);
  border: none;
  color: #fff;
  border-radius: 50px;
  padding: .35rem 1rem;
  cursor: pointer;
  font-size: 1.1rem;
}
.fc-hint       { position: absolute; bottom: 1rem; font-size: .75rem; opacity: .65; }
.fc-trans      { font-size: clamp(1.4rem, 5vw, 2rem); font-weight: 800; color: var(--dark); }
.fc-meta       { font-size: .85rem; color: var(--text-light); }
.fc-example    { font-size: .9rem; color: var(--text-light); margin-top: .5rem; }
.fc-example-sq { font-size: .82rem; opacity: .8; }
.fc-note       { font-size: .8rem; color: var(--primary); margin-top: .5rem; }

.fc-controls { text-align: center; margin-top: 1.5rem; }
.fc-question { color: var(--text-light); margin-bottom: .75rem; }
.fc-buttons  { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; }
.fc-btn {
  border: 2px solid #ececf5;
  background: #fff;
  border-radius: 50px;
  padding: .65rem 1.6rem;
  font-weight: 700;
  cursor: pointer;
  transition: var(--transition);
}
.fc-btn-no:hover  { border-color: #e53935; background: #fce8e8; color: #c62828; }
.fc-btn-yes:hover { border-color: #27ae60; background: #e8f5e9; color: #2e7d32; }

/* Pyetjet e praktikës */
.practice-question { max-width: 40rem; margin: 0 auto; text-align: center; }
.pq-label   { font-size: .8rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-light); }
.pq-word    { font-size: clamp(1.75rem, 6vw, 2.5rem); font-weight: 800; color: var(--dark); margin: .5rem 0; }
.pq-word-sq { color: var(--primary); }
.pq-phon    { font-size: 1rem; color: var(--text-light); margin-bottom: 1rem; }

.pq-listen { padding: 1.5rem 0; }
.pq-listen-btn {
  width: 5.5rem;
  height: 5.5rem;
  border-radius: 50%;
  border: none;
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
  font-size: 2rem;
  cursor: pointer;
  box-shadow: var(--shadow);
}
.pq-listen-btn:hover { transform: scale(1.05); }
.pq-listen-hint      { font-size: .8rem; color: var(--text-light); margin-top: .6rem; }

.pq-options { display: grid; gap: .6rem; margin-top: 1.25rem; }
@media (min-width: 576px) { .pq-options { grid-template-columns: 1fr 1fr; } }
.pq-option {
  border: 2px solid #ececf5;
  background: #fff;
  border-radius: 12px;
  padding: .85rem 1rem;
  font-size: 1rem;
  cursor: pointer;
  transition: var(--transition);
}
.pq-option:hover:not(:disabled) { border-color: var(--primary); background: var(--bg-light); }
.pq-option.is-correct { border-color: #27ae60; background: #e8f5e9; color: #2e7d32; font-weight: 700; }
.pq-option.is-wrong   { border-color: #e53935; background: #fce8e8; color: #c62828; }
.pq-option:disabled   { cursor: default; }

.pq-typing { display: flex; gap: .5rem; justify-content: center; margin-top: 1.25rem; flex-wrap: wrap; }
.pq-input {
  flex: 1 1 16rem;
  border: 2px solid #ececf5;
  border-radius: 12px;
  padding: .75rem 1rem;
  font-size: 1.1rem;
  text-align: center;
}
.pq-input:focus      { outline: none; border-color: var(--primary); }
.pq-input.is-correct { border-color: #27ae60; background: #e8f5e9; }
.pq-input.is-wrong   { border-color: #e53935; background: #fce8e8; }

.pq-feedback { margin-top: 1.5rem; padding: 1.25rem; border-radius: 12px; }
.pq-feedback.is-correct { background: #e8f5e9; }
.pq-feedback.is-wrong   { background: #fce8e8; }
.pq-fb-title { font-weight: 800; font-size: 1.1rem; }
.pq-fb-word  { font-size: 1.5rem; font-weight: 800; color: var(--dark); margin-top: .25rem; }
.pq-fb-phon  { font-size: .88rem; color: var(--text-light); }
.pq-fb-ex    { font-size: .9rem; margin-top: .6rem; }

/* Përmbledhja e seancës */
.practice-summary { text-align: center; max-width: 38rem; margin: 0 auto; padding: 2rem 1rem; }
.summary-emoji   { font-size: 3.5rem; }
.summary-score   { font-size: 3rem; font-weight: 800; color: var(--primary); line-height: 1; }
.summary-detail  { color: var(--text-light); }
.summary-missed  { text-align: left; margin-top: 2rem; }
.summary-missed-list { display: grid; gap: .4rem; }
.summary-missed-item {
  display: flex;
  align-items: center;
  gap: .6rem;
  background: #fff;
  border: 1px solid #ececf5;
  border-radius: 10px;
  padding: .5rem .75rem;
}
.smi-word  { font-weight: 700; }
.smi-trans { color: var(--text-light); font-size: .9rem; flex: 1; }
.summary-actions { display: flex; gap: .75rem; justify-content: center; flex-wrap: wrap; margin-top: 1.75rem; }

/* ── Progresi i kursit dhe i mësimit ─────────────────────────── */
.course-progress-track {
  height: 10px;
  background: rgba(255, 255, 255, .25);
  border-radius: 50px;
  overflow: hidden;
  max-width: 26rem;
}
.course-progress-fill {
  height: 100%;
  width: 0;
  background: #fff;
  border-radius: 50px;
  transition: width .5s ease;
}

.lesson-done-btn {
  background: #fff;
  border: 2px solid #ececf5;
  border-radius: 50px;
  padding: .5rem 1.15rem;
  font-weight: 600;
  font-size: .9rem;
  cursor: pointer;
  transition: var(--transition);
}
.lesson-done-btn:hover   { border-color: var(--primary); color: var(--primary); }
.lesson-done-btn.is-done { background: #e8f5e9; border-color: #27ae60; color: #2e7d32; }

.lesson-done-mark { display: none; color: #27ae60; font-weight: 800; }
.lesson-item.is-done .lesson-done-mark { display: inline; }
.lesson-item.is-done { background: rgba(39, 174, 96, .05); }

/* ── Kuizi ───────────────────────────────────────────────────── */
.quiz-hero {
  background: linear-gradient(135deg,
              rgba(108, 99, 255, .12), rgba(108, 99, 255, .05));
  border-bottom: 3px solid var(--lang-color, var(--primary));
  padding: 2.5rem 0;
}
.quiz-review { text-align: left; margin-top: 1.5rem; display: grid; gap: .6rem; }
.quiz-review-item {
  border: 1px solid #ececf5;
  border-left-width: 4px;
  border-radius: 10px;
  padding: .75rem .9rem;
  background: #fff;
}
.quiz-review-item.ok { border-left-color: #27ae60; }
.quiz-review-item.no { border-left-color: #e53935; }
.qri-head  { display: flex; gap: .5rem; align-items: flex-start; }
.qri-num   { font-weight: 800; color: var(--text-light); }
.qri-q     { flex: 1; font-weight: 600; }
.qri-mark  { flex-shrink: 0; }
.qri-line  { font-size: .88rem; margin-top: .3rem; }
.qri-label { color: var(--text-light); }
.qri-exp   { font-size: .85rem; background: var(--bg-light); border-radius: 8px; padding: .5rem .65rem; margin-top: .5rem; }

.quiz-option.selected { border-color: var(--primary); background: rgba(108, 99, 255, .08); font-weight: 600; }

/* ── Mjetet në ballinë ───────────────────────────────────────── */
.tools-section { background: #fff; }
.tool-card {
  background: #fff;
  border: 1px solid #ececf5;
  border-radius: 16px;
  padding: 1.75rem 1.5rem;
  display: flex;
  flex-direction: column;
  gap: .5rem;
  transition: var(--transition);
}
.tool-card:hover { box-shadow: var(--shadow); transform: translateY(-3px); }
.tool-card-wotd {
  background: linear-gradient(135deg, var(--primary), var(--primary-dark));
  color: #fff;
  border: none;
}
.tool-badge {
  align-self: flex-start;
  font-size: .68rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  background: rgba(255, 255, 255, .2);
  border-radius: 50px;
  padding: .2rem .7rem;
}
.wotd-word  { font-size: 2rem; font-weight: 800; }
.wotd-phon  { font-size: .9rem; opacity: .9; }
.wotd-trans { font-size: 1.15rem; }
.wotd-ex    { font-size: .85rem; opacity: .9; margin-top: .5rem; }
.wotd-ex .text-muted { color: rgba(255, 255, 255, .7) !important; }

.tool-icon  { font-size: 2.5rem; }
.tool-title { font-size: 1.15rem; font-weight: 700; }
.tool-desc  { font-size: .9rem; color: var(--text-light); }
.tool-langs { display: flex; gap: .4rem; justify-content: center; flex-wrap: wrap; margin: .5rem 0 1rem; }
.tool-lang-pill {
  display: inline-flex;
  align-items: center;
  gap: .3rem;
  border: 1px solid #ececf5;
  border-radius: 50px;
  padding: .25rem .7rem;
  text-decoration: none;
  color: var(--text-light);
  font-size: .8rem;
  font-weight: 600;
  transition: var(--transition);
}
.tool-lang-pill:hover { border-color: var(--primary); color: var(--primary); }

/* ── Ekrane të vegjël ────────────────────────────────────────── */
@media (max-width: 575.98px) {
  .dict-search-row { flex-direction: column; }
  .dict-select,
  .dict-search-btn { width: 100%; }
  .practice-stats  { grid-template-columns: repeat(2, 1fr); }
  .fc-card         { height: 17rem; }
  .word-main-right { flex: 1 1 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .fc-inner,
  .course-progress-fill,
  .practice-progress-fill,
  .tool-card,
  .practice-mode,
  .dict-card { transition: none !important; }
}