:root{--bg1: #0b0422;--bg2: #271043;--accent: #9b6bff;--glass: rgba(255,255,255,.04);--muted: rgba(255,255,255,.78)}*{box-sizing:border-box}html,body,#root{height:100%}.traditional body,body{margin:0;font-family:Tajawal,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial;background:radial-gradient(900px 500px at 8% 12%,rgba(155,107,255,.06),transparent 6%),linear-gradient(135deg,var(--bg1),var(--bg2));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:var(--muted);display:flex;align-items:center;justify-content:center;padding:28px}.app-root{width:100%;max-width:920px;padding:0 12px}.card{background:linear-gradient(180deg,#ffffff05,#00000005);border-radius:18px;padding:28px 22px;box-shadow:0 12px 60px #05061499;-webkit-backdrop-filter:blur(8px) saturate(115%);backdrop-filter:blur(8px) saturate(115%);border:1px solid rgba(155,107,255,.06);display:flex;flex-direction:column;align-items:center;gap:10px;width:100%;position:relative}.title{margin:0 0 6px;font-family:Amiri,Tajawal,serif;font-weight:500;font-size:22px;color:var(--muted);letter-spacing:.2px}.zekr{font-size:clamp(18px,3.8vw,30px);text-align:center;padding:14px 18px;margin-bottom:8px;color:var(--muted);line-height:1.5;max-width:94%;background:linear-gradient(180deg,#9b6bff05,#ffffff03);border-radius:12px;border:1px solid rgba(155,107,255,.04)}.count{font-size:clamp(34px,6.5vw,68px);font-family:Amiri,serif;font-weight:700;margin-bottom:10px;color:var(--muted);text-shadow:0 4px 14px rgba(0,0,0,.45)}.main-button{width:clamp(140px,34vw,240px);height:clamp(140px,34vw,240px);border-radius:50%;border:2px solid rgba(155,107,255,.12);cursor:pointer;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 40% 30%,#9b6bff0f,#00000008),linear-gradient(180deg,#1e102df2,#0a0814fa);color:var(--muted);font-size:clamp(18px,2.2vw,22px);transition:transform .18s cubic-bezier(.2,.9,.25,1),box-shadow .2s,border-color .2s;box-shadow:0 14px 40px #00000080,inset 0 -8px 30px #0006;position:relative;overflow:visible}.main-button:active{transform:scale(.96)}.main-button .btn-text{pointer-events:none}.main-button.pulse{animation:btn-pulse .22s ease-out}@keyframes btn-pulse{0%{transform:scale(1)}50%{transform:scale(1.06)}to{transform:scale(1)}}.main-button:before{content:"";position:absolute;top:-10px;right:-10px;bottom:-10px;left:-10px;border-radius:50%;background:conic-gradient(var(--accent) var(--progress),rgba(255,255,255,.02) 0%);z-index:-2;filter:blur(8px) saturate(120%);opacity:.95;transition:background .18s linear,opacity .24s}.main-button:after{content:"";position:absolute;top:8px;right:8px;bottom:8px;left:8px;border-radius:50%;background:linear-gradient(180deg,#00000047,#ffffff05);z-index:-1}.controls{display:flex;gap:12px;margin-top:14px}.ghost{background:transparent;border:1px solid rgba(155,107,255,.06);color:var(--muted);padding:8px 12px;border-radius:10px;cursor:pointer;transition:all .16s}.ghost:hover{transform:translateY(-4px);box-shadow:0 10px 20px #02061773}.footer{margin-top:12px;font-size:12px;color:#ffffff73}.ripple{position:absolute;width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%) scale(0);background:radial-gradient(circle at 30% 30%,#9b6bfff2,#9b6bff73);box-shadow:0 10px 30px #9b6bff14;animation:ripple-anim .7s cubic-bezier(.2,.9,.25,1);pointer-events:none;will-change:transform,opacity}@keyframes ripple-anim{to{transform:translate(-50%,-50%) scale(14);opacity:0}}.main-button.pulse{box-shadow:0 22px 60px #9b6bff24,0 8px 36px #0009,inset 0 -10px 40px #00000073;transform:scale(1.02);border-color:#9b6bff47}.main-button:hover{transform:translateY(-6px) scale(1.01);box-shadow:0 28px 80px #000000ad}@media (max-width:420px),(max-height:600px){.main-button{width:clamp(110px,36vw,160px);height:clamp(110px,36vw,160px)}.count{font-size:clamp(28px,6.5vw,44px)}.card{padding:20px}}@media (min-width:720px){.card{padding:36px;border-radius:24px}.controls{gap:16px}.footer{font-size:13px}}@media (min-width:1000px){.card{max-width:820px;margin-inline:auto;padding:40px 48px}.zekr{font-size:28px}.count{font-size:clamp(48px,6vw,96px)}}