@import url('https://fonts.googleapis.com/css2?family=Amiri:ital,wght@0,400;0,700;1,400&family=Noto+Kufi+Arabic:wght@300;400;500;600;700;800&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Inter:wght@300;400;500;600;700&display=swap');

html body, html body h1, html body h2, html body h3, html body h4,
html body h5, html body h6, html body input, html body select,
html body textarea, html body button, html body table {
  font-family:"Inter","Noto Kufi Arabic",Tahoma,sans-serif!important;
}
html body {line-height:1.8}
.developer {
  box-sizing:border-box;position:relative;clear:both;
  width:100%;max-width:100%;margin:32px auto 0;
  padding:20px 12px calc(26px + env(safe-area-inset-bottom));
  color:#aaa9a4;font-family:"Inter",sans-serif;
  font-size:11px;font-weight:400;letter-spacing:.7px;
  text-align:center;direction:ltr;line-height:1.8;
}
.developer a {
  position:relative;display:inline-block;margin-left:7px;padding:4px 3px;
  color:#f6d785;text-decoration:none;font-family:"Inter",sans-serif;
  font-size:16px;font-weight:700;letter-spacing:.5px;transform-origin:center;
  animation:developerNameFloat 2.8s ease-in-out infinite;
  transition:color .35s ease,transform .35s ease,letter-spacing .35s ease;
}
.developer a::before {
  content:attr(data-credit-name);position:absolute;inset:4px 3px;
  color:transparent;
  background:linear-gradient(110deg,transparent 25%,#d6aa4b 43%,#f6d785 49%,#fff9e8 52%,#d6aa4b 57%,transparent 72%);
  background-size:300% 100%;-webkit-background-clip:text;background-clip:text;
  animation:developerNameShine 3s linear infinite;pointer-events:none;
}
.developer a::after {
  content:"";position:absolute;left:50%;bottom:-6px;transform:translateX(-50%);
  width:30%;height:2px;border-radius:20px;
  background:linear-gradient(90deg,transparent,#d6aa4b,#f6d785,#d6aa4b,transparent);
  box-shadow:0 3px 8px rgba(214,170,75,.2);
  animation:developerNameLine 2.8s ease-in-out infinite;
}
@keyframes developerNameShine {from{background-position:220% center}to{background-position:-220% center}}
@keyframes developerNameFloat {0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes developerNameLine {0%,100%{width:25%;opacity:.4}50%{width:100%;opacity:1}}
.developer a:hover,.developer a:focus-visible {
  color:#fff3cf;letter-spacing:1px;animation:none;transform:translateY(-3px) scale(1.06);
}
.developer a:focus-visible {outline:2px solid #f6d785;outline-offset:5px;border-radius:4px}
@media(max-width:600px) {
  .developer {line-height:2}
  .developer a {display:block;width:max-content;max-width:100%;margin:7px auto 0}
}
@media(prefers-reduced-motion:reduce) {
  .developer a,.developer a::before,.developer a::after {animation:none;transition:none}
  .developer a:hover,.developer a:focus-visible {transform:none}
}
@media print {.developer{display:none}}