body { font-family: "Jameel Noori Nastaleeq", "Noto Nastaliq Urdu", serif; font-size: 26px; line-height: 2; max-width: 950px; margin: 0 auto; padding: 40px 30px; background-color: #0d1b2a; color: #eee; }
* { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; }
h1 { font-size: 42px; color: #9c27b0; text-align: center; margin-bottom: 30px; }
h2 { font-size: 34px; color: #9c27b0; margin-top: 40px; line-height: 1.7; }
h3 { font-size: 30px; color: #9c27b0; margin-top: 30px; line-height: 1.7; }
p { margin: 0 0 20px 0; text-align: justify; }
.concept { background: #1b263b; border-right: 5px solid #9c27b0; padding: 20px; border-radius: 10px; margin: 20px 0; }
.concept h3 { margin-top: 0; color: #9c27b0; font-size: 28px; }
.concept .en { color: #e0a800; font-size: 24px; margin-bottom: 10px; }
.example { background: #0d1b2a; padding: 15px; border-radius: 8px; margin-top: 10px; border: 1px solid #1b263b; }
.example strong { color: #e0a800; }
.diagram { text-align: center; background: #1b263b; border-radius: 15px; padding: 30px; margin: 30px 0; overflow: hidden; }
.diagram svg { max-width: 100%; height: auto; display: block; margin: 0 auto; }
.notice { background: #2d1b1b; border: 2px solid #e94560; border-radius: 12px; padding: 15px 20px; margin: 30px 0; font-size: 22px; color: #f0a0a0; }
.nav { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 30px; }
.nav a, .nav span { color: #9c27b0; text-decoration: none; padding: 10px 20px; background: #1b263b; border-radius: 10px; font-size: 24px; }
.nav a:hover { background: #9c27b0; color: #fff; }
.nav span { color: #666; opacity: 0.45; }
.footer { text-align: center; color: #666; margin-top: 40px; font-size: 20px; }
svg text { direction: rtl; }
.keypoints { background: #1b263b; border-right: 5px solid #9c27b0; border-radius: 10px; padding: 18px 24px; margin: 25px 0; }
.keypoints h3 { margin-top: 0; color: #9c27b0; }
table { width: 100%; border-collapse: collapse; margin: 20px 0; background: #1b263b; border-radius: 10px; overflow: hidden; }
th { background: #9c27b0; color: #fff; padding: 12px 15px; text-align: right; font-weight: bold; }
td { padding: 10px 15px; border-bottom: 1px solid #0d1b2a; text-align: right; }
tr:nth-child(even) { background: #162032; }