@font-face{
  font-family:"ShlomoSemiStamWeb";
  src:url("assets/fonts/shlomo/ShlomoSemiStam.ttf") format("truetype");
  font-display:swap;
}

:root{
  --taam-quiz-hebrew-font:"ShlomoSemiStamWeb", "Noto Serif Hebrew", serif;
}

.taam-quiz-page .section-tight{
  padding-bottom:.4rem;
}

.taam-quiz-page .section-tight + .section-soft{
  padding-top:1.6rem;
}

.taam-quiz-shell{
  display:grid;
  gap:1.25rem;
}

.taam-quiz-card,
.taam-quiz-feedback,
.taam-quiz-empty{
  background:rgba(255,253,248,.9);
  border:1px solid rgba(201,189,168,.86);
  border-radius:28px;
  box-shadow:var(--shadow);
}

.taam-quiz-card{
  padding:1.35rem;
  display:grid;
  gap:1.2rem;
}

.taam-quiz-toolbar{
  display:block;
}

.taam-quiz-toolbar-copy{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:.8rem 1rem;
  min-width:0;
  padding:.95rem 1rem;
  border:1px solid rgba(201,189,168,.78);
  border-radius:24px;
  background:
    linear-gradient(135deg, rgba(255,250,245,.96), rgba(247,240,231,.92));
}

.taam-quiz-scope-card{
  flex:1 1 100%;
  display:grid;
  gap:.18rem;
  padding:.82rem .92rem;
  border:1px solid rgba(201,189,168,.82);
  border-radius:20px;
  background:rgba(255,255,255,.74);
  box-shadow:0 10px 22px rgba(20,53,52,.05);
}

.taam-quiz-scope-kicker,
.taam-quiz-scope-detail{
  margin:0;
  color:var(--ink-faint);
}

.taam-quiz-scope-kicker{
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.taam-quiz-scope-label{
  color:var(--ink);
  font-size:1rem;
}

.taam-quiz-scope-detail{
  font-size:.92rem;
}

.taam-quiz-reference{
  display:inline;
  margin-inline-start:.45em;
  color:var(--ink-faint);
  font:inherit;
  letter-spacing:inherit;
  white-space:nowrap;
  unicode-bidi:isolate;
}

.taam-quiz-difficulty-group{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  flex:1 1 20rem;
  gap:.55rem;
}

.taam-quiz-difficulty-chip{
  display:grid;
  gap:0;
  min-width:0;
  padding:.58rem .62rem;
  border:1px solid rgba(201,189,168,.92);
  border-radius:18px;
  background:rgba(255,255,255,.84);
  color:var(--ink);
  cursor:pointer;
  text-align:center;
  transition:transform .18s ease, border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
}

.taam-quiz-difficulty-chip:hover{
  transform:translateY(-1px);
  border-color:var(--line-strong);
}

.taam-quiz-difficulty-chip:disabled{
  opacity:.46;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
}

.taam-quiz-difficulty-chip[aria-pressed="true"]{
  border-color:rgba(20,53,52,.58);
  background:rgba(210,229,223,.78);
  box-shadow:inset 0 0 0 1px rgba(20,53,52,.12);
}

.taam-quiz-difficulty-chip strong{
  font-size:.98rem;
}

.taam-quiz-scorecard{
  min-width:0;
  flex:0 1 auto;
}

.taam-quiz-score-grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:.5rem;
  margin:0;
}

.taam-quiz-score-item{
  display:inline-flex;
  align-items:baseline;
  gap:.42rem;
  padding:.44rem .7rem;
  border-radius:999px;
  border:1px solid rgba(201,189,168,.82);
  background:rgba(255,255,255,.72);
  box-shadow:0 10px 22px rgba(20,53,52,.06);
  white-space:nowrap;
}

.taam-quiz-score-item:nth-child(2){
  border-color:rgba(80,130,84,.24);
  background:rgba(236,247,234,.88);
}

.taam-quiz-score-item:nth-child(3){
  border-color:rgba(182,140,58,.26);
  background:rgba(252,244,222,.92);
}

.taam-quiz-score-item dt{
  margin:0;
  color:var(--ink-faint);
  font-size:.68rem;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  line-height:1;
}

.taam-quiz-score-item dd{
  margin:0;
  color:var(--ink);
  font-size:1.08rem;
  font-weight:700;
  line-height:1;
}

.taam-quiz-question-head{
  display:flex;
  align-items:center;
  gap:1rem;
}

.taam-quiz-verse{
  margin:0;
  font-family:var(--taam-quiz-hebrew-font);
  font-size:clamp(1.44rem, 2.88vw, 2.07rem);
  line-height:1.62;
  direction:rtl;
  text-align:right;
}

.taam-quiz-word{
  display:inline-flex;
  margin-inline-start:.08em;
}

.taam-quiz-word--blank{
  vertical-align:baseline;
}

.taam-quiz-word-pill{
  display:inline-flex;
  align-items:center;
  gap:.22rem;
  min-height:1.56rem;
  padding:.03rem .32rem;
  border-radius:14px;
  border:1px dashed rgba(20,53,52,.34);
  background:rgba(255,249,236,.98);
  box-shadow:0 6px 16px rgba(20,53,52,.05);
}

.taam-quiz-word-pill.is-selected{
  border-style:solid;
  border-color:rgba(20,53,52,.38);
  background:rgba(248,244,234,.98);
  box-shadow:0 8px 18px rgba(20,53,52,.07);
}

.taam-quiz-word-pill.is-correct{
  border-style:solid;
  border-color:rgba(80,130,84,.6);
  background:rgba(232,247,229,.95);
}

.taam-quiz-word-pill.is-wrong{
  border-style:solid;
  border-color:rgba(164,75,55,.54);
  background:rgba(253,236,231,.96);
}

.taam-quiz-word-text{
  min-width:0;
  font-family:var(--taam-quiz-hebrew-font);
}

.taam-quiz-word-index{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:1.08rem;
  height:1.08rem;
  border-radius:999px;
  background:rgba(20,53,52,.14);
  color:var(--brand);
  font-size:.63rem;
  font-weight:700;
}

.taam-quiz-answer-grid{
  display:grid;
  width:100%;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 15.5rem), 1fr));
  align-content:start;
  gap:.85rem;
}

.taam-quiz-answer-card{
  display:grid;
  gap:.48rem;
  padding:.82rem .86rem;
  border-radius:20px;
  border:1px solid rgba(201,189,168,.82);
  background:rgba(255,255,255,.84);
}

.taam-quiz-answer-row{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  flex-wrap:nowrap;
  gap:.55rem;
  min-width:0;
}

.taam-quiz-answer-heading{
  display:inline-flex;
  align-items:flex-start;
  gap:.42rem;
  min-width:0;
  flex:1 1 auto;
  max-width:100%;
}

.taam-quiz-answer-number{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:1.5rem;
  height:1.5rem;
  padding:0 .35rem;
  border-radius:999px;
  background:rgba(20,53,52,.12);
  color:var(--brand);
  font-size:1rem;
  flex:0 0 auto;
}

.taam-quiz-answer-word{
  color:var(--ink-soft);
  font-size:1.08rem;
  font-family:var(--taam-quiz-hebrew-font);
  flex:1 1 auto;
  min-width:0;
  max-width:100%;
  overflow:visible;
  text-overflow:clip;
  white-space:normal;
  overflow-wrap:anywhere;
}

.taam-quiz-hint{
  display:inline-flex;
  align-items:center;
  padding:.28rem .58rem;
  border-radius:999px;
  background:rgba(106,125,69,.12);
  color:var(--brand-2);
  font-size:.76rem;
  font-weight:700;
}

.taam-quiz-answer-card select{
  display:block;
  width:100%;
  max-width:100%;
  min-width:0;
  min-height:2.45rem;
  padding:.56rem .58rem;
  padding-inline-end:2.7rem;
  border-radius:15px;
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.94);
  color:var(--ink);
  font-size:.95rem;
  transition:border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.taam-quiz-answer-control{
  position:relative;
  display:block;
  flex:0 0 clamp(8.25rem, 44%, 11.75rem);
  min-width:0;
  width:clamp(8.25rem, 44%, 11.75rem);
  max-width:100%;
}

.taam-quiz-answer-control.is-submitted select{
  appearance:none;
  -webkit-appearance:none;
  -moz-appearance:none;
}

.taam-quiz-answer-control.is-correct select{
  border-color:rgba(80,130,84,.56);
  background:rgba(242,251,240,.96);
  box-shadow:0 0 0 3px rgba(80,130,84,.1);
}

.taam-quiz-answer-control.is-wrong select{
  border-color:rgba(164,75,55,.5);
  background:rgba(255,246,242,.98);
  box-shadow:0 0 0 3px rgba(164,75,55,.08);
}

.taam-quiz-answer-icon{
  position:absolute;
  top:50%;
  inset-inline-end:.42rem;
  width:2.3rem;
  height:2.3rem;
  pointer-events:none;
  opacity:0;
  transform:translateY(-50%);
}

.taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon{
  opacity:1;
}

.taam-quiz-answer-icon.is-correct{
  color:#2d6a39;
}

.taam-quiz-answer-icon.is-wrong{
  color:#8f3d2b;
}

.taam-quiz-answer-icon svg{
  width:100%;
  height:100%;
  shape-rendering:geometricPrecision;
}

.taam-quiz-answer-icon path,
.taam-quiz-answer-icon line{
  fill:none;
  stroke:currentColor;
  stroke-width:3.3;
  stroke-linecap:round;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
  stroke-dasharray:100;
  stroke-dashoffset:100;
  opacity:0;
}

.taam-quiz-icon-bar{
  position:absolute;
  top:50%;
  left:50%;
  width:1.32rem;
  height:0;
  border-top:3.3px solid currentColor;
  border-radius:999px;
  opacity:0;
}

.taam-quiz-answer-icon.is-wrong .stroke-1{
  transform:translate(-50%, -50%) rotate(45deg) scaleX(0);
}

.taam-quiz-answer-icon.is-wrong .stroke-2{
  transform:translate(-50%, -50%) rotate(-45deg) scaleX(0);
}

.taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon svg .stroke-1{
  animation:taam-quiz-answer-stroke .11s linear .03s forwards;
}

.taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon svg .stroke-2{
  animation:taam-quiz-answer-stroke .12s linear .14s forwards;
}

.taam-quiz-visually-hidden{
  position:absolute;
  width:1px;
  height:1px;
  padding:0;
  margin:-1px;
  overflow:hidden;
  clip:rect(0, 0, 0, 0);
  white-space:nowrap;
  border:0;
}

@keyframes taam-quiz-answer-stroke{
  from{
    opacity:1;
    stroke-dashoffset:100;
  }
  to{
    opacity:1;
    stroke-dashoffset:0;
  }
}

@keyframes taam-quiz-answer-cross-stroke-1{
  from{
    opacity:1;
    transform:translate(-50%, -50%) rotate(45deg) scaleX(0);
  }
  to{
    opacity:1;
    transform:translate(-50%, -50%) rotate(45deg) scaleX(1);
  }
}

@keyframes taam-quiz-answer-cross-stroke-2{
  from{
    opacity:1;
    transform:translate(-50%, -50%) rotate(-45deg) scaleX(0);
  }
  to{
    opacity:1;
    transform:translate(-50%, -50%) rotate(-45deg) scaleX(1);
  }
}

.taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon.is-wrong .stroke-1{
  animation:taam-quiz-answer-cross-stroke-1 .11s linear .03s forwards;
}

.taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon.is-wrong .stroke-2{
  animation:taam-quiz-answer-cross-stroke-2 .12s linear .14s forwards;
}

.taam-quiz-actions{
  display:flex;
  flex-wrap:wrap;
  gap:.75rem;
}

.taam-quiz-actions .button,
.taam-quiz-actions button{
  cursor:pointer;
}

.taam-quiz-actions .button:disabled,
.taam-quiz-actions button:disabled{
  cursor:not-allowed;
  opacity:.55;
  box-shadow:none;
  transform:none;
  filter:saturate(.72);
}

.taam-quiz-feedback{
  padding:1rem 1.05rem;
  display:grid;
  gap:.8rem;
}

.taam-quiz-feedback.is-correct{
  border-color:rgba(80,130,84,.38);
  background:rgba(242,250,240,.92);
}

.taam-quiz-feedback.is-wrong{
  border-color:rgba(164,75,55,.3);
  background:rgba(255,248,246,.94);
}

.taam-quiz-feedback-head h3{
  margin:0 0 .2rem;
}

.taam-quiz-feedback-head p{
  margin:0;
  color:var(--ink-soft);
}

.taam-quiz-feedback-list{
  display:grid;
  gap:.72rem;
}

.taam-quiz-feedback-item{
  padding:.82rem .88rem;
  border-radius:18px;
  border:1px solid rgba(201,189,168,.72);
  background:rgba(255,255,255,.78);
}

.taam-quiz-feedback-item.is-correct{
  border-color:rgba(80,130,84,.28);
  background:rgba(247,252,246,.94);
}

.taam-quiz-feedback-item.is-wrong{
  border-color:rgba(164,75,55,.22);
  background:rgba(255,252,251,.94);
}

.taam-quiz-feedback-item h4{
  margin:0 0 .28rem;
  font-size:1rem;
}

.taam-quiz-feedback-item p{
  margin:0;
  color:var(--ink-soft);
}

.taam-quiz-feedback-item p.taam-quiz-feedback-status{
  font-weight:600;
  color:var(--ink);
}

.taam-quiz-feedback-item p + p{
  margin-top:.32rem;
}

.taam-quiz-empty{
  padding:1.2rem;
}

.taam-quiz-empty-actions{
  margin-top:1rem;
}

@media (max-width: 900px){
  .taam-quiz-score-grid{
    justify-content:flex-start;
  }
}

@media (max-width: 720px){
  .taam-quiz-question-head{
    flex-direction:column;
    align-items:flex-start;
  }

  .taam-quiz-difficulty-group{
    grid-template-columns:repeat(2, minmax(0, 1fr));
    width:100%;
  }

  .taam-quiz-scorecard{
    width:100%;
  }

  .taam-quiz-score-grid{
    display:grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    justify-content:stretch;
  }

  .taam-quiz-score-item{
    width:100%;
    justify-content:space-between;
    min-width:0;
  }

  .taam-quiz-difficulty-chip{
    min-width:0;
  }
}

@media (max-width: 560px){
  .taam-quiz-card,
  .taam-quiz-feedback,
  .taam-quiz-toolbar-copy{
    padding:1rem;
  }

  .taam-quiz-reference{
    font-size:inherit;
  }

  .taam-quiz-difficulty-chip{
    font-size:.94rem;
  }

  .taam-quiz-difficulty-chip strong{
    font-size:.92rem;
  }

  .taam-quiz-score-item dt{
    font-size:.64rem;
  }

  .taam-quiz-score-item dd{
    font-size:1rem;
  }

  .taam-quiz-verse{
    font-size:1.28rem;
    line-height:1.64;
  }

  .taam-quiz-answer-grid{
    grid-template-columns:minmax(0, 1fr);
    gap:0;
    padding:.34rem .84rem;
    border-radius:22px;
    border:1px solid rgba(201,189,168,.82);
    background:rgba(255,255,255,.84);
  }

  .taam-quiz-answer-card{
    gap:.32rem;
    padding:.68rem 0;
    border:0;
    border-radius:0;
    background:transparent;
  }

  .taam-quiz-answer-card + .taam-quiz-answer-card{
    border-top:1px solid rgba(201,189,168,.72);
  }

  .taam-quiz-answer-row{
    gap:.46rem;
  }

  .taam-quiz-answer-card select{
    min-height:2.28rem;
  }

  .taam-quiz-answer-number{
    font-size:.96rem;
  }

  .taam-quiz-answer-word{
    font-size:1rem;
  }

  .taam-quiz-hint{
    font-size:.72rem;
  }

  .taam-quiz-score-grid{
    gap:.42rem;
  }

  .taam-quiz-feedback-head p,
  .taam-quiz-feedback-item p{
    font-size:.95rem;
  }

  .taam-quiz-feedback-item h4{
    font-size:.95rem;
  }

  .taam-quiz-actions .button,
  .taam-quiz-actions button{
    font-size:.95rem;
  }

  .taam-quiz-actions{
    flex-direction:column;
  }

  .taam-quiz-actions .button{
    width:100%;
  }
}

@media (prefers-reduced-motion: reduce){
  .taam-quiz-answer-card select{
    transition:none;
  }

  .taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon{
    opacity:1;
    transform:translateY(-50%);
  }

  .taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon svg .stroke-1,
  .taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon svg .stroke-2{
    animation:none;
    opacity:1;
    stroke-dashoffset:0;
  }

  .taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon.is-wrong .stroke-1{
    animation:none;
    opacity:1;
    transform:translate(-50%, -50%) rotate(45deg) scaleX(1);
  }

  .taam-quiz-answer-control.is-submitted .taam-quiz-answer-icon.is-wrong .stroke-2{
    animation:none;
    opacity:1;
    transform:translate(-50%, -50%) rotate(-45deg) scaleX(1);
  }
}