* { box-sizing: border-box; margin: 0; padding: 0; }
body {
    font-family: 'Arial', sans-serif;
    background-color: #f5f6fa;
    color: #2f3640;
    line-height: 1.6;
    text-align: center;
}
header {
    background-color: #1e90ff;
    color: #fff;
    padding: 1rem;
}
header h1 { font-size: 2rem; }
main { max-width: 600px; margin: 2rem auto; padding: 0 1rem; }
input[type="text"], input[type="password"], textarea {
    width: 90%; padding: 0.7rem; margin: 0.5rem 0; border-radius: 5px; border:1px solid #ccc; font-size:1rem;
}
textarea { min-height: 60px; resize: vertical; }
button {
    padding: 0.6rem 1rem; margin: 0.5rem; border-radius:5px; border:none;
    background-color:#1e90ff; color:#fff; cursor:pointer; transition:0.2s;
}
button:hover { background-color:#3742fa; }
.auth-buttons { display:flex; justify-content:center; gap:1rem; margin-bottom:0.5rem; }
.card { background-color:#fff; padding:1rem; margin:1rem 0; border-radius:8px; box-shadow:0 2px 6px rgba(0,0,0,0.15); text-align:left; }
ul { list-style:none; padding-left:0; }
li { margin:0.5rem 0; }
.logout-btn { background-color:#ff4757; }
.logout-btn:hover { background-color:#ff6b81; }
#tasbih-count { font-weight:bold; font-size:1.2rem; margin-left:0.5rem; }
#quran-display { margin-top:1rem; font-size:1.2rem; direction:rtl; text-align:right; border:1px solid #ccc; padding:0.5rem; border-radius:5px; background-color:#fff; }
#qibla-direction { font-weight:bold; margin-top:0.5rem; }
@media(max-width:600px){
    body{ font-size:0.9rem;}
    input[type="text"], input[type="password"], textarea{ width:95%; }
}