:root{--bg-deep: #070710;--bg-surface: #0e0e1e;--bg-card: #13132a;--bg-card-hover: #1a1a35;--gold: #C9A84C;--gold-light: #F0D080;--gold-dim: #8a6f2e;--gold-glow: rgba(201, 168, 76, .35);--gold-glow-sm: rgba(201, 168, 76, .15);--green: #2D6A4F;--green-light: #52b788;--text: #F5F0E8;--text-muted: #7a7590;--text-dim: #4a4560;--border: rgba(201, 168, 76, .12);--border-active: rgba(201, 168, 76, .5);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 20px;--radius-xl: 28px;--font-arabic: "Scheherazade New", "Amiri", serif;--font-ui: "Inter", sans-serif;--arabic-color: var(--gold-light);--arabic-size: 24px;--text-translit: rgba(255,255,255,.5);--safe-top: env(safe-area-inset-top, 0px);--safe-bottom: env(safe-area-inset-bottom, 0px)}[data-theme=light]{--bg-deep: #f5f0e8;--bg-surface: #ede7d8;--bg-card: #e4dccb;--bg-card-hover: #d9d0bc;--text: #1a1510;--text-muted: #6b5f50;--text-dim: #a09080;--border: rgba(100, 80, 30, .15);--border-active: rgba(100, 80, 30, .4);--text-translit: rgba(60, 45, 30, .7);--gold: #2d8a65;--gold-light: #3daa80;--gold-dim: #1a6048;--gold-glow: rgba(45, 138, 101, .3);--gold-glow-sm: rgba(45, 138, 101, .12)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;overflow:hidden}body{background:var(--bg-deep);color:var(--text);font-family:var(--font-ui);font-size:16px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{display:flex;flex-direction:column;position:relative;max-width:430px;margin:0 auto}.scroll-y{overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:none}.scroll-y::-webkit-scrollbar{display:none}.arabic{font-family:var(--font-arabic);direction:rtl;unicode-bidi:bidi-override}.gold{color:var(--gold)}.gold-light{color:var(--gold-light)}@keyframes goldShimmer{0%{background-position:200% center}to{background-position:-200% center}}.gold-shimmer{background:linear-gradient(90deg,#b8891f,#e8c84a,#fffbe0 40%,#f5d060,#c9a84c 70%,#fffbe0 82%,#b8891f);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:goldShimmer 4s linear infinite}.arabic.gold-shimmer,.gold-shimmer.arabic{font-family:var(--font-arabic)}[data-theme=light] .gold-shimmer{background:linear-gradient(90deg,#1a6b50,#2d8a65,#7dd4b0 40%,#3daa80,#2d8a65 70%,#7dd4b0 82%,#1a6b50);background-size:200% auto;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:goldShimmer 4s linear infinite}.glow-text{text-shadow:0 0 20px var(--gold-glow),0 0 60px rgba(201,168,76,.2)}.btn{display:flex;align-items:center;justify-content:center;gap:8px;border:none;outline:none;cursor:pointer;font-family:var(--font-ui);font-weight:500;border-radius:var(--radius-lg);transition:all .2s ease;-webkit-user-select:none;user-select:none}.btn-primary{background:linear-gradient(135deg,#c9a84c,#f0d080,#c9a84c);color:#070710;font-weight:600;padding:16px 32px;font-size:16px;width:100%;box-shadow:0 0 24px #c9a84c66,0 4px 16px #0006}.btn-primary:active{transform:scale(.97);box-shadow:0 0 12px #c9a84c4d}.btn-ghost{background:transparent;color:var(--gold);border:1px solid var(--border);padding:14px 28px;font-size:15px;width:100%}.btn-ghost:active{background:var(--gold-glow-sm)}.input-wrap{display:flex;flex-direction:column;gap:6px}.input-label{font-size:12px;font-weight:500;color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase}.input-field{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-family:var(--font-ui);font-size:16px;padding:14px 16px;outline:none;width:100%;transition:border-color .2s,box-shadow .2s}.input-field::placeholder{color:var(--text-dim)}.input-field:focus{border-color:var(--border-active);box-shadow:0 0 0 3px var(--gold-glow-sm)}.page{height:100%;display:flex;flex-direction:column;background:var(--bg-deep);position:relative;overflow:hidden}.pattern-bg:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:radial-gradient(circle at 20% 20%,rgba(201,168,76,.04) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(201,168,76,.04) 0%,transparent 50%);pointer-events:none;z-index:0}.error-msg{color:#ff6b6b;font-size:13px;text-align:center;padding:8px 12px;background:#ff6b6b14;border-radius:var(--radius-sm);border:1px solid rgba(255,107,107,.15)}.progress-dots{display:flex;gap:8px;justify-content:center}.dot{width:6px;height:6px;border-radius:50%;background:var(--text-dim);transition:all .3s ease}.dot.active{width:20px;border-radius:3px;background:var(--gold);box-shadow:0 0 8px var(--gold-glow)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes goldenPulse{0%,to{text-shadow:0 0 20px rgba(201,168,76,.6),0 0 60px rgba(201,168,76,.3),0 0 100px rgba(201,168,76,.15)}50%{text-shadow:0 0 40px rgba(201,168,76,.9),0 0 80px rgba(201,168,76,.5),0 0 140px rgba(201,168,76,.25)}}@keyframes sparkle{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--tx),var(--ty)) scale(0);opacity:0}}@keyframes heartBeat{0%{transform:scale(1)}30%{transform:scale(1.35)}60%{transform:scale(.9)}to{transform:scale(1)}}@keyframes nurRise{0%{opacity:0;transform:translateY(20px) scale(.8)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideIn{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}@keyframes floatUp{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-60px)}}@keyframes orb{0%,to{transform:translate(0) scale(1)}33%{transform:translate(6px,-8px) scale(1.05)}66%{transform:translate(-4px,4px) scale(.97)}}.orb{position:absolute;border-radius:50%;filter:blur(60px);pointer-events:none;animation:orb 8s ease-in-out infinite}.orb-gold{background:radial-gradient(circle,rgba(201,168,76,.18) 0%,transparent 70%)}.orb-deep{background:radial-gradient(circle,rgba(45,106,79,.12) 0%,transparent 70%)}.divider{display:flex;align-items:center;gap:12px;color:var(--text-dim);font-size:12px}.divider:before,.divider:after{content:"";flex:1;height:1px;background:var(--border)}