*{box-sizing:border-box}
body{margin:0;font-family:Tahoma,Arial,sans-serif;background:#061522;color:#eef5ff;direction:rtl}
a{text-decoration:none;color:inherit}
header{background:linear-gradient(135deg,#142b5d,#1c245a);padding:28px 18px 24px;text-align:center;border-bottom:1px solid #29446a}
header h1{font-size:42px;margin:10px 0;color:#fff}
header p{font-size:20px;color:#b9c8e2;margin:0}
.brand{font-size:15px;color:#8eb8ff}
nav{display:flex;gap:10px;overflow-x:auto;padding:14px;background:#071728;border-bottom:1px solid #203852;white-space:nowrap}
nav a{padding:14px 22px;border-radius:18px;background:#10253c;border:1px solid #24415e}
main{max-width:980px;margin:auto;padding:26px 18px 50px}
.card{background:#0d1d2d;border:1px solid #24415e;border-radius:24px;padding:28px;margin:20px 0;box-shadow:0 10px 30px #0003}
.hero{background:linear-gradient(135deg,#122c50,#211f55);text-align:center}
h2{font-size:32px;margin-top:0}
label{display:block;font-size:19px;margin:18px 0 8px}
input,select,button{width:100%;padding:16px;border-radius:17px;border:1px solid #294661;background:#071725;color:#fff;font-size:18px}
button{background:linear-gradient(90deg,#4b9cf7,#8a50ed);border:0;cursor:pointer;margin-top:18px}
.result{margin-top:18px;padding:18px;border-radius:16px;background:#081a2b;font-size:20px;min-height:25px}
table{width:100%;border-collapse:collapse;margin-top:20px}
th,td{padding:14px;border-bottom:1px solid #21384f;text-align:right}
footer{text-align:center;padding:32px 18px;border-top:1px solid #203852;color:#aebdd0;font-size:17px}
small{color:#93a8bf}