body.verbMapModalOpen{
  overflow:hidden;
}
.verbMapModal{
  position:fixed;
  z-index:10000;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
}
.verbMapOverlay{
  position:absolute;
  inset:0;
  background:rgba(15,23,42,.62);
}
.verbMapPanel{
  position:relative;
  width:min(1050px,96vw);
  max-height:92vh;
  overflow:auto;
  padding:24px;
  border-radius:12px;
  background:#fff;
  box-shadow:0 24px 70px rgba(15,23,42,.3);
}
.verbMapPanel h3{
  margin:0 48px 20px 0;
  color:#111827;
  font-size:25px;
}
.verbMapPanel h3 span{
  color:#9a3412;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:31px;
}
.verbMapPanel h4{
  margin:20px 0 12px;
  color:#111827;
  font-size:21px;
}
.verbMapPanel .activeTenseTitle{
  margin-top:0;
}
.verbMapPanel>p{
  color:#475569;
  font-size:16px;
  line-height:1.5;
}
.verbMapClose{
  position:absolute;
  top:15px;
  right:15px;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:#dc504d;
  color:#fff;
  cursor:pointer;
  font-weight:700;
  font-size:22px;
}
.verbMapClose:hover,
.verbMapClose:focus{
  background:#b42318;
  outline:3px solid rgba(220,80,77,.22);
}
.verbModalExample{
  margin-bottom:20px;
}
.verbModalExample p{
  margin:5px 0;
  color:#1f2937;
  font-size:18px;
  line-height:1.55;
}
.verbModalExample p span{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:25px;
}
.verbModalParts{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}
.verbModalPart{
  display:grid;
  min-width:120px;
  gap:2px;
  padding:9px 11px;
  border:1px solid #d4e1f5;
  border-radius:8px;
  background:#fbfdff;
}
.verbModalPart b{
  color:#3568d4;
  font-size:13px;
}
.verbModalPart strong{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:22px;
}
.verbModalPart em{
  color:#9a3412;
  font-size:13px;
  font-style:normal;
}
.verbModalPart small{
  color:#475569;
  font-size:12px;
}
.verbPersonTableWrap{
  margin:18px 0;
  overflow:auto;
}
.verbPersonTable{
  width:100%;
  min-width:790px;
  border-collapse:collapse;
}
.verbPersonTable th,
.verbPersonTable td{
  padding:10px 12px;
  border:1px solid #cfdcf0;
  color:#111827;
  text-align:left;
  vertical-align:middle;
}
.verbPersonTable th{
  background:#e8f0ff;
  font-size:15px;
}
.verbPersonTable td:first-child b,
.verbPersonTable td:first-child span,
.verbPersonTable td:nth-child(2) b,
.verbPersonTable td:nth-child(2) small{
  display:block;
}
.verbPersonTable td:first-child b,
.verbPersonTable td:nth-child(2) b{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:25px;
  line-height:1.55;
}
.verbPersonTable td:first-child span,
.verbPersonTable td:nth-child(2) small{
  margin-top:2px;
  color:#64748b;
  font-size:12px;
}
.verbPersonTable .verbPersonPronunciation{
  display:block;
  margin-top:1px;
  color:#9a3412;
  font-size:12px;
}
.verbPersonTable .selectedPersonRow td{
  background:#fff2d6;
}
.verbPersonTable .selectedPersonRow td:first-child{
  box-shadow:inset 4px 0 #d97706;
}
.verbPersonGuide{
  display:grid;
  gap:5px;
  margin:16px 0 0;
  padding:12px 14px;
  border:1px solid #bfdbfe;
  border-radius:8px;
  background:#eff6ff;
  color:#334155;
  font-size:14px;
  line-height:1.55;
}
.verbPersonGuide b{
  color:#173b7a;
  font-size:16px;
}
.verbPersonHint{
  margin:16px 0 -4px;
  padding:10px 12px;
  border-left:4px solid #0f766e;
  border-radius:6px;
  background:#ecfdf5;
  color:#334155;
  font-size:14px;
  line-height:1.5;
}
.verbPersonMarker{
  min-width:225px;
}
.verbPersonMarker > span{
  display:flex;
  align-items:center;
  gap:8px;
}
.verbPersonMarker > span + span{
  margin-top:5px;
}
.verbPersonMarker small{
  width:48px;
  color:#64748b;
  font-size:12px;
}
.verbPersonMarker b{
  color:#075985;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:20px;
}
.verbPersonMarker > span > strong{
  color:#9a3412;
  font-size:14px;
}
.verbPersonMarker em{
  display:block;
  margin-top:7px;
  color:#334155;
  font-size:13px;
  font-style:normal;
  line-height:1.35;
}
.verbBaseForms{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}
.verbBaseForms span{
  display:grid;
  grid-template-columns:auto auto;
  align-items:center;
  column-gap:7px;
  row-gap:2px;
  padding:9px 12px;
  border:1px solid #cfdcf0;
  border-radius:8px;
  background:#eef4ff;
}
.verbBaseForms b{
  color:#173b7a;
}
.verbBaseForms strong{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:22px;
}
.verbBaseForms em,
.verbBaseForms small{
  grid-column:1/-1;
  font-size:12px;
  font-style:normal;
}
.verbBaseForms em{
  color:#9a3412;
}
.verbBaseForms small{
  color:#475569;
}
.verbModalNote{
  color:#475569;
  font-size:14px;
}
.verbMapTableWrap{
  overflow:auto;
}
.verbMapTable{
  width:100%;
  min-width:900px;
  border-collapse:collapse;
}
.verbMapTable th{
  padding:10px;
  border:1px solid #cad6e8;
  color:#111827;
  text-align:left;
}
.verbMapTable thead th{
  background:#fff100;
}
.verbMapTable tbody th{
  width:180px;
  background:#f8fafc;
  font-weight:500;
}
.verbMapTable td{
  min-width:240px;
  padding:11px;
  border:1px solid #cad6e8;
  background:#fff4c9;
  vertical-align:top;
  cursor:pointer;
}
.verbMapTable td>b,
.verbMapTable td>span,
.verbMapTable td>i,
.verbMapTable td>small,
.verbMapTable td>em{
  display:block;
}
.verbMapTable td>b{
  margin-bottom:7px;
  color:#334155;
}
.verbMapTable td>span{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:28px;
  line-height:1.65;
}
.verbMapTable td>i{
  color:#9a3412;
  font-size:12px;
  font-style:normal;
}
.verbMapTable td>small{
  margin-top:5px;
  color:#475569;
  font-size:13px;
}
.verbMapTable td>em{
  margin-top:7px;
  color:#9a3412;
  font-size:12px;
  font-style:normal;
}
.verbMapTable tbody tr:nth-child(2) td{
  background:#e5f6ef;
}
.verbMapTable tbody tr:nth-child(3) td{
  background:#fffbc5;
}
.verbMapTable tbody tr:nth-child(4) td{
  background:#f8fafc;
}
.verbMapTable .verbMapCell:hover,
.verbMapTable .verbMapCell:focus{
  outline:2px solid #2f6fff;
  outline-offset:-2px;
}
.verbMapTable .activeTenseCell{
  outline:3px solid #2f6fff;
  outline-offset:-3px;
}
.arabicPatternNote{
  display:grid;
  gap:7px;
  margin-top:12px;
  padding:14px 16px;
  border:1px solid #cbdcf8;
  border-left:5px solid #2f6fff;
  border-radius:9px;
  background:#f7faff;
}
.arabicPatternNote b{
  color:#111827;
  font-size:18px;
}
.arabicPatternNote span{
  color:#1f2937;
  font-size:17px;
}
.arabicPatternNote em{
  color:#475569;
  font-size:14px;
}
.arabicSentenceOrder{
  margin:20px 0;
  padding:16px;
  border:1px solid #cbdcf8;
  border-radius:10px;
  background:#f8fbff;
}
.arabicSentenceOrder header h4{
  margin:0 0 4px;
  color:#0f172a;
  font-size:20px;
}
.arabicSentenceOrder header p{
  margin:0 0 12px;
  color:#475569;
  font-size:14px;
}
.arabicOrderFormula{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(145px,1fr));
  gap:8px;
}
.arabicOrderFormula>span{
  display:grid;
  gap:2px;
  min-width:0;
  padding:10px;
  border:1px solid #cbd5e1;
  border-radius:8px;
  background:#fff;
}
.arabicOrderFormula small{color:#2f6fff;font-size:12px;font-weight:800}
.arabicOrderFormula b{color:#0f172a;font-size:14px}
.arabicOrderFormula em{
  color:#111827;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:30px;
  font-style:normal;
  line-height:1.5;
}
.arabicOrderFormula i{color:#64748b;font-size:12px;font-style:normal}
.arabicOrderFormula u{color:#9a3412;font-size:12px;text-decoration:none}
.arabicOrderFormula .orderVerb,.arabicOrderFormula .orderVerbPhrase{border-color:#5aa99d;background:#ecfdf5}
.arabicOrderFormula .orderSubject{border-color:#93c5fd;background:#eff6ff}
.arabicOrderFormula .orderObject{border-color:#c4b5fd;background:#f5f3ff}
.arabicOrderFormula .orderAdjective{border-style:dashed;background:#fff7ed}
.arabicOrderFormula .orderImplicit{border-style:dashed;border-color:#60a5fa;background:#eff6ff}
.arabicOrderFormula .orderComplement{background:#f8fafc}
.arabicOrderFormula .orderHelper{background:#fff7ed}
.arabicOrderFormula .orderUnknown{border-style:dotted;background:#f8fafc}
.arabicOrderFormula .orderTime,.arabicOrderFormula .orderPlace{background:#f0fdfa}
.arabicOrderExample{
  display:grid;
  gap:3px;
  margin-top:10px;
  padding:12px;
  border-left:4px solid #0f766e;
  border-radius:7px;
  background:#ecfdf5;
}
.arabicOrderExample b{
  color:#0f172a;
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:34px;
  line-height:1.55;
}
.arabicOrderExample small{color:#9a3412}
.arabicOrderExample span{color:#334155}
.arabicOrderRules{display:grid;gap:6px;margin-top:10px}
.arabicOrderRules p{
  margin:0;
  color:#334155;
  font-size:13px;
  line-height:1.45;
}
.arabicOrderRules span{
  font-family:"Noto Naskh Arabic","Segoe UI",serif;
  font-size:18px;
}

@media(max-width:900px){
  .arabicOrderFormula{grid-template-columns:repeat(3,minmax(0,1fr))}
}

@media(max-width:700px){
  .verbMapModal{padding:6px}
  .verbMapPanel{width:100%;max-height:97vh;padding:17px 14px}
  .verbMapPanel h3{font-size:21px}
  .verbModalExample p{font-size:16px}
  .verbModalParts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .verbModalPart{min-width:0}
}
@media(max-width:430px){
  .verbModalParts{grid-template-columns:1fr}
  .arabicSentenceOrder{padding:12px}
  .arabicOrderFormula{grid-template-columns:repeat(2,minmax(0,1fr))}
  .arabicOrderExample b{font-size:28px}
}