:root{--primary: #0B7285;--primary-dark: #064E5C;--accent: #D4AF37;--accent-light: #F4E4C1;--text-dark: #1A202C;--text-light: #718096;--success: #38A169;--card-bg: #FFFFFF;--shadow: rgba(0, 0, 0, .1)}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,Arabic Typesetting,Simplified Arabic,Tahoma,Arial,sans-serif;background:linear-gradient(135deg,#0b7285,#064e5c);background-attachment:fixed;color:var(--text-dark);min-height:100vh}body:before{content:"";position:fixed;inset:0;background-image:repeating-linear-gradient(45deg,transparent,transparent 35px,rgba(212,175,55,.05) 35px,rgba(212,175,55,.05) 70px),repeating-linear-gradient(-45deg,transparent,transparent 35px,rgba(212,175,55,.03) 35px,rgba(212,175,55,.03) 70px);pointer-events:none;z-index:0}.container{max-width:1100px;margin:0 auto;padding:1rem;position:relative;z-index:1}header{background:#fffffffa;backdrop-filter:blur(10px);color:var(--primary-dark);padding:1rem 0;box-shadow:0 2px 20px var(--shadow);position:sticky;top:0;z-index:100;border-bottom:3px solid var(--accent)}header nav{display:flex;justify-content:space-between;align-items:center}header nav a{color:var(--primary);text-decoration:none;font-size:1.5rem;font-weight:700;display:flex;align-items:center;gap:.5rem}header nav a:before{content:"\262a";font-size:1.8rem;color:var(--accent)}header nav button{background:var(--primary);color:#fff;border:none;padding:.5rem 1.25rem;border-radius:8px;cursor:pointer;font-weight:600;transition:all .3s;box-shadow:0 2px 8px #0b72854d}header nav button:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 4px 12px #0b728566}main{padding:2rem 0}h2,h3{color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.3);margin-bottom:1.5rem}.card{background:var(--card-bg);border-radius:12px;padding:1.5rem;margin-bottom:1.5rem;box-shadow:0 4px 20px var(--shadow);border-top:4px solid var(--accent);transition:transform .3s,box-shadow .3s}.card:hover{transform:translateY(-4px);box-shadow:0 8px 30px #00000026}.khatmah-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;margin-top:2rem}.khatmah-card{background:#fff;border-radius:12px;padding:1.5rem;box-shadow:0 4px 15px #0000001a;border-left:5px solid var(--accent);transition:all .3s;cursor:pointer}.khatmah-card:hover{transform:translateY(-5px);box-shadow:0 8px 25px #00000026}.khatmah-card h3{color:var(--primary);margin:0 0 .5rem;text-shadow:none;font-size:1.25rem}.khatmah-card p{color:var(--text-light);margin:.25rem 0;font-size:.9rem}.khatmah-card .country{display:inline-block;background:var(--accent-light);color:var(--primary-dark);padding:.25rem .75rem;border-radius:20px;font-size:.85rem;font-weight:600;margin-top:.5rem}form{background:#fff;padding:2rem;border-radius:12px;box-shadow:0 4px 20px #0000001a;border-top:4px solid var(--accent)}label{display:block;margin:1rem 0 .25rem;font-weight:600;color:var(--text-dark)}input,select,textarea{width:100%;padding:.75rem;margin-top:.25rem;border:2px solid #E2E8F0;border-radius:8px;font-size:1rem;transition:border-color .3s;font-family:inherit}input:focus,select:focus,textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0b72851a}button{background:var(--primary);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s;margin-top:1rem;box-shadow:0 2px 8px #0b72854d}button:hover{background:var(--primary-dark);transform:translateY(-2px);box-shadow:0 4px 12px #0b728566}button:disabled{background:#cbd5e0;cursor:not-allowed;transform:none}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:1rem;margin-top:1.5rem}.grid .card{text-align:center;padding:1.25rem;cursor:pointer;border-top:3px solid var(--primary);position:relative;overflow:hidden}.grid .card:before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 0%,rgba(212,175,55,.05) 100%);pointer-events:none}.grid .card.done{background:linear-gradient(135deg,#e6fffa,#b2f5ea);border-top-color:var(--success)}.grid .card.done:after{content:"\2713";position:absolute;top:.5rem;right:.5rem;color:var(--success);font-size:1.5rem;font-weight:700}.grid .card.selectable{border:2px dashed var(--primary);background:#0b728508}.grid .card.selected{background:var(--accent-light);border:3px solid var(--accent);transform:scale(1.05)}.part-grid-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem}.part-grid-header h3{margin:0}.part-grid-header .select-info{color:var(--accent-light);font-size:.9rem;background:#fff3;padding:.5rem 1rem;border-radius:20px}.message{padding:1rem;border-radius:8px;margin:1rem 0;font-weight:600}.message.success{background:#c6f6d5;color:#22543d;border-left:4px solid var(--success)}.message.error{background:#fed7d7;color:#742a2a;border-left:4px solid #E53E3E}.share-link{background:var(--accent-light);padding:1.5rem;border-radius:8px;margin-top:1.5rem;border:2px solid var(--accent)}.share-link a{color:var(--primary);font-weight:600;word-break:break-all}.rtl{direction:rtl;text-align:right}.loading{text-align:center;color:#fff;font-size:1.2rem;padding:3rem}.empty-state{text-align:center;color:#fff;padding:3rem;background:#ffffff1a;border-radius:12px;backdrop-filter:blur(10px)}.empty-state h3{font-size:1.5rem;margin-bottom:1rem}@media (max-width: 768px){.khatmah-list{grid-template-columns:1fr}.grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:.75rem}}