.quiz-card{background:#fff;border:2px solid #f7d9ff;border-radius:20px;box-shadow:0 2px 8px #f7d9ff33;padding:24px;margin-bottom:24px}.quiz-title{font-size:2rem;font-weight:700;color:#6a4580;margin-bottom:1.5rem}.quiz-arabic{font-size:2.2rem;font-weight:700;color:#5a2180}.quiz-choice{background:#fff;border:2px solid #ffd6ec;border-radius:12px;padding:12px 18px;margin-bottom:12px;cursor:pointer;transition:all .2s;font-size:1rem;color:#4a2560}.arabic{font-size:1.45rem;font-weight:700;line-height:1;display:inline-block;padding:2px 6px}.multi-checkbox{display:inline-block;width:18px;height:18px;border:2px solid #ffd6ec;border-radius:4px;margin-right:10px;vertical-align:middle;transition:background .12s,border-color .12s,transform .08s}.multi-checkbox.checked{background:#ffb8dd;border-color:#ff9aca;transform:scale(.98)}.quiz-choice.selected{background:#e3f2fd;border-color:#90caf9;box-shadow:0 2px 8px #2196f34d;transform:translate(4px)}.quiz-choice:hover{background:#fff0f8;border-color:#ffb8dd;transform:translate(6px)}.quiz-choice:active{background:#fff0f8;border-color:#ffb8dd}.quiz-choice.correct{background:#d4ffdc;border-color:#7cdb8d;color:#1a5c2a}.quiz-choice.wrong{background:#ffd4d4;border-color:#ff8a8a;color:#7a1f1f}.quiz-btn{background:#ffb8dd;color:#4f1232;border-radius:16px;font-weight:600;border:none;padding:10px 24px;font-size:1rem;margin-top:18px;cursor:pointer;transition:.2s}.quiz-btn:hover{background:#ff9aca;transform:scale(1.03)}.quiz-btn:active{background:#ff9aca;transform:scale(.98)}.quiz-result{background:#fff7ff;border:2px solid #ffd6ec;border-radius:18px;padding:24px;text-align:center;margin-top:32px}.quiz-result-title{font-size:1.5rem;color:#7a2ea5;margin-bottom:12px}.quiz-result-score{font-size:2.2rem;color:#4f1232;font-weight:700;margin-bottom:8px}.quiz-container{max-width:820px;margin:0 0 40px;padding:20px}.quiz-name-screen{display:flex;align-items:center;justify-content:center;background:transparent;position:relative;padding:40px 0}.quiz-name-box{max-width:380px;width:90%;border:3px solid #ffd6ec;border-radius:25px;background:#fff;padding:2rem;box-shadow:0 2px 12px #ffd6ec33}.quiz-name-input{width:100%;padding:12px;margin:16px 0;border-radius:8px;border:2px solid #ffd6ec;font-size:16px;box-sizing:border-box;transition:border-color .2s}.quiz-name-input:focus{outline:none;border-color:#ffb8dd;box-shadow:0 0 0 3px #ffb8dd33}.quiz-name-screen.hidden{display:none!important}.letters-container{display:flex;gap:10px;flex-wrap:wrap;padding:8px 6px;background:transparent;border-radius:8px}.letter-item{background:#fff;padding:8px 12px;border-radius:10px;border:2px solid #ffd6ec;cursor:pointer;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s;-webkit-user-select:none;user-select:none;display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;font-size:20px}.letter-item:active{transform:scale(.98)}.letter-item.selected{background:#f3e5ff;box-shadow:0 6px 18px #7a2ea540;transform:translateY(-4px) scale(1.05);border-color:#b88adb;animation:pulse .6s ease-in-out infinite alternate}@keyframes pulse{0%{box-shadow:0 6px 18px #7a2ea540}to{box-shadow:0 8px 24px #7a2ea566}}.letter-item.correct{background:#d4ffdc;border-color:#7cdb8d;color:#1a5c2a}.letter-item.wrong{background:#ffd4d4;border-color:#ff8a8a;color:#7a1f1f}@media(max-width:900px){.letter-item{min-width:56px;min-height:56px;font-size:26px;padding:10px 14px}}.letters-container{touch-action:manipulation}@media(hover:none),(pointer:coarse){.quiz-choice:hover,.quiz-choice:active{transform:none!important;background:#fff!important;border-color:#ffd6ec!important}.quiz-choice.selected{transform:none!important;background:#e3f2fd!important;border-color:#90caf9!important}.quiz-choice{touch-action:manipulation}}.categories-container{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:12px}.category-box{background:#fff;border:2px dashed #e6c6ff;border-radius:14px;padding:18px;text-align:center;min-height:160px;box-sizing:border-box;transition:background .2s,border-color .2s,transform .15s}.category-box:hover{border-color:#d8a1ff}.category-box h5{color:#7a2ea5;font-size:18px;margin:0 0 8px}.drop-zone{transition:background .12s,border-color .12s}.drop-zone.drag-over{background:#fff7ff;border-color:#d8a1ff}.category-box .letter-item{margin:6px 8px 6px 0;display:inline-flex}@media(max-width:900px){.categories-container{grid-template-columns:1fr}}html,body{margin:0;padding:0;overflow-x:hidden!important;width:100%}.content-area{padding:20px;width:100%;max-width:900px;margin:0 auto 0 60px}.sidebar{width:230px;background:#ffeaf6;padding:25px;min-height:100vh;border-right:2px solid #fcd7f0}.sidebar-title{margin-bottom:25px}.sidebar-menu{list-style:none;padding:0}.sidebar-link{text-decoration:none;color:#333;padding:10px 14px;display:block;border-radius:8px;margin-bottom:12px;transition:.2s}.sidebar-link.active{background:#ff8fcf;color:#fff}.back-button{background:#ffb3d9;border:none;padding:10px 16px;border-radius:8px;margin-bottom:20px;cursor:pointer;font-weight:500;color:#fff;box-shadow:0 2px 4px #ff96c84d;transition:transform .15s ease,box-shadow .15s ease,background .15s ease;display:inline-block}.back-button:hover{transform:translateY(-2px);background:#ff9aca;box-shadow:0 6px 14px #ff82b947}.back-button:active{transform:translateY(0);box-shadow:0 3px 6px #ff78aa38}.back-button:focus{outline:3px solid rgba(255,140,190,.25);outline-offset:2px}.sidebar,.sidebar-menu{overflow-x:hidden}.hamburger-btn{display:none;position:fixed;top:15px;left:15px;z-index:1001;background:#ff8fcf;border:none;border-radius:8px;width:45px;height:45px;font-size:24px;color:#fff;cursor:pointer;box-shadow:0 2px 8px #ff8fcf66;transition:.2s}.hamburger-btn:hover{background:#ff6fb8;transform:scale(1.05)}.hamburger-btn:active{transform:scale(.95)}.sidebar-backdrop{display:none}@media(min-width:768px){.huruf-grid{max-width:700px}}@media(max-width:767px){.hamburger-btn{display:block}.sidebar-backdrop{display:block;position:fixed;inset:0;background:#00000080;z-index:999}.app-container{flex-direction:column;margin:0;padding:0}.sidebar{position:fixed;top:0;left:-100%;width:280px;height:100vh;min-height:100vh;z-index:1000;transition:left .3s ease;overflow-y:auto;box-shadow:4px 0 25px #0000004d;border-right:none;border-bottom:none;padding:25px;background:#ffeaf6}.sidebar.sidebar-open{left:0}.sidebar-title{text-align:left!important;display:block!important;justify-content:flex-start!important;padding:50px 0 15px!important;margin:0 0 20px!important;font-size:19px!important;font-weight:600!important;border-bottom:2px solid rgba(255,143,207,.3);color:#4a2560}.sidebar-menu{display:flex!important;flex-direction:column!important;gap:0!important;padding:0!important;margin:0!important;list-style:none!important;width:100%!important}.sidebar-link{display:block!important;background:transparent!important;margin:0 0 8px!important;padding:14px 16px!important;font-size:15px!important;border-radius:10px!important;white-space:normal!important;text-align:left!important;transition:all .2s ease!important;color:#333;font-weight:500}.sidebar-link:hover{background:#ffb8dd4d!important;transform:translate(4px)!important}.sidebar-link.active{background:#ff8fcf!important;color:#fff!important;box-shadow:0 2px 8px #ff8fcf66}.content-area{padding:70px 15px 15px;width:100%!important;max-width:100%!important;margin-left:0!important;box-sizing:border-box}.quiz-name-screen{padding:20px 15px}.quiz-name-box{width:100%;max-width:100%;padding:1.5rem}.quiz-title{font-size:1.5rem}.quiz-name-input{font-size:16px;padding:14px}.huruf-grid{max-width:100%!important;width:100%!important}.huruf-content{padding:15px}}.sifat-page{padding:20px;max-width:740px;width:100%;margin:0;display:block;box-sizing:border-box}.sifat-title{font-size:26px;font-weight:700;margin-bottom:10px;text-align:left;width:100%}.sifat-compare{display:flex;gap:20px;margin-top:20px}@media(max-width:767px){.sifat-compare{flex-direction:column}}.sifat-card{flex:1;padding:20px;border-radius:18px;background:#fff;border:2px solid #ffd7ee;box-shadow:0 4px 12px #ffb4dc40;text-align:center}.sifat-icon{font-size:46px;margin-bottom:10px;display:block}.sifat-card h3{font-size:22px;margin-bottom:8px}.quiz-page-title{font-size:28px;font-weight:800;color:#6a4580;text-align:center;margin:18px 0 12px;padding-top:6px}.quiz-page-subtitle{display:block;text-align:center;color:#7a2ea5;font-size:14px;margin-bottom:14px}.sifat-desc{font-size:15px;line-height:1.6;margin-bottom:15px}.huruf-box{background:#fff;border:1.5px solid #f5cde1;padding:10px;border-radius:12px;font-size:28px;line-height:1.8}.sifat-divider{text-align:center;color:#999;margin:12px 0;font-size:14px}.theme-hams{background:#e6f4ff;border-color:#bcdfff}.theme-jahr{background:#ffe6f2;border-color:#ffcae1}.theme-shiddah{background:#ffe6e9;border-color:#ffb7c3}.theme-rikhawah{background:#e6ffef;border-color:#b6f7cc}.theme-tawassut{background:#f1f0ff;border-color:#d4d4ff}.theme-istila{background:#f4e9ff;border-color:#dbb8ff}.theme-istifal{background:#fff7da;border-color:#ffe4a8}.theme-itbaq{background:#ffe9da;border-color:#ffcaab}.theme-infitah{background:#e5fffb;border-color:#b4fff0}.theme-idzlaq{background:#e8f6ff;border-color:#bce7ff}.theme-ismat{background:#f7eee7;border-color:#e7d7ca}.sifat-pair{background:#fff6fc;border:2px solid #ffd8eb;border-radius:16px;padding:16px;margin-bottom:16px;box-shadow:0 4px 10px #ffbee140;cursor:pointer;transition:.2s;display:block;box-sizing:border-box;width:100%;flex:0 0 100%}.sifat-pair:hover{transform:translateY(-2px);box-shadow:0 6px 14px #ff96c84d}.sifat-pair-content{display:flex;justify-content:flex-start;align-items:center;gap:12px;font-size:22px;font-weight:600}.sifat-pair-icons{font-size:24px}.sifat-pair-multi{display:flex;gap:10px;justify-content:flex-start;align-items:center;font-size:22px;font-weight:600}@media(max-width:767px){.sifat-pair-content{flex-direction:column;gap:6px}.sifat-pair-multi{flex-direction:column;gap:4px}.sifat-pair{flex:0 0 100%;width:100%}}.list-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;max-width:680px;width:100%}.list-card{background:#fff;border:2px solid #ffe0f0;padding:20px;border-radius:15px;box-shadow:0 4px 10px #ffb4d726;transition:transform .25s,box-shadow .25s;color:#444;text-decoration:none;display:block;box-sizing:border-box}.list-card h3{margin:0;font-size:18px}.list-card:hover{transform:translateY(-4px);box-shadow:0 6px 14px #ff96c838}@media(max-width:767px){.list-grid{grid-template-columns:1fr}}