.pattern-lock-container{-webkit-user-select:none;user-select:none;touch-action:none;flex-direction:column;justify-content:center;align-items:center;display:flex}.pattern-lock-svg{touch-action:none;filter:drop-shadow(0 0 10px #6c5ce733);width:320px;height:320px;overflow:visible}.pattern-lock-svg.error{filter:drop-shadow(0 0 10px #ff767566);animation:.4s cubic-bezier(.36,.07,.19,.97) both shake}.pattern-node-bg{fill:var(--bg-tertiary);transition:all .3s}.pattern-node-inner{fill:var(--text-muted);transition:all .3s}.pattern-node.active .pattern-node-bg{fill:#6c5ce733;stroke:var(--accent-primary);stroke-width:2px}.pattern-node.active .pattern-node-inner{fill:var(--accent-neon);filter:drop-shadow(0 0 5px var(--accent-neon))}.error .pattern-node.active .pattern-node-bg{fill:#ff767533;stroke:var(--error)}.error .pattern-node.active .pattern-node-inner{fill:var(--error);filter:drop-shadow(0 0 5px var(--error))}.error .pattern-line{stroke:var(--error);filter:drop-shadow(0 0 4px var(--error))}.pattern-line{stroke:var(--accent-primary);stroke-width:6px;stroke-linecap:round;stroke-linejoin:round;fill:none;opacity:.8;filter:drop-shadow(0 0 4px var(--accent-primary));transition:stroke .3s}.pattern-line-drawing{stroke:var(--accent-neon);stroke-width:6px;stroke-linecap:round;opacity:.6;border-style:dashed}@keyframes shake{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-8px)}40%,60%{transform:translate(8px)}}@keyframes node-activate{0%{transform:scale(1)}50%{transform:scale(1.5)}to{transform:scale(1)}}.pattern-node.active .pattern-node-inner{transform-origin:50%;animation:.3s cubic-bezier(.175,.885,.32,1.275) node-activate}:root{--font-arabic:"Tajawal", sans-serif;--font-english:"Inter", sans-serif;--font-main:var(--font-arabic);--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-full:9999px;--transition-fast:.15s ease;--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--accent-primary:#6c5ce7;--accent-secondary:#a29bfe;--accent-gold:#fdcb6e;--accent-neon:#00cec9;--error:#ff7675;--success:#55efc4;--warning:#ffeaa7;--bg-primary:#0f111a;--bg-secondary:#1a1d2d;--bg-tertiary:#252a40;--text-primary:#f5f6fa;--text-secondary:#dcdde1;--text-muted:#7f8fa6;--glass-bg:#1a1d2d99;--glass-bg-hover:#ffffff0d;--glass-bg-elevated:#0003;--glass-border:#ffffff14;--glass-shadow:0 8px 32px 0 #0000005e;--border-subtle:#ffffff1a;--btn-ghost-border:#ffffff1a;--radial-gradient-1:#6c5ce714;--radial-gradient-2:#00cec914}@media (prefers-color-scheme:light){:root{--bg-primary:#f0f2f5;--bg-secondary:#fff;--bg-tertiary:#e4e6eb;--text-primary:#1c1e21;--text-secondary:#4b4f56;--text-muted:#90949c;--glass-bg:#ffffffb3;--glass-bg-hover:#00000008;--glass-bg-elevated:#0000000d;--glass-border:#0000000f;--glass-shadow:0 8px 32px 0 #00000014;--border-subtle:#0000000d;--btn-ghost-border:#0000001a;--radial-gradient-1:#6c5ce70d;--radial-gradient-2:#00cec90d;--accent-secondary:#5848d0}}[lang=en]{--font-main:var(--font-english)}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--bg-primary);color:var(--text-primary);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15% 50%, var(--radial-gradient-1), transparent 25%), radial-gradient(circle at 85% 30%, var(--radial-gradient-2), transparent 25%);min-height:100vh;transition:background-color var(--transition-normal), color var(--transition-normal);background-attachment:fixed}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--glass-border);border-radius:var(--radius-md);box-shadow:var(--glass-shadow);transition:background var(--transition-normal), border var(--transition-normal)}.glass-pill{background:var(--glass-bg);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--glass-border);border-radius:var(--radius-full)}.text-gradient{background:linear-gradient(135deg, var(--accent-secondary), var(--accent-neon));color:#0000;-webkit-background-clip:text;background-clip:text}.text-gold{background:linear-gradient(135deg, var(--accent-gold), #ffeaa7);color:#0000;-webkit-background-clip:text;background-clip:text}.btn{border-radius:var(--radius-full);cursor:pointer;transition:var(--transition-normal);border:none;justify-content:center;align-items:center;padding:12px 24px;font-family:inherit;font-size:1rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--accent-primary), var(--accent-neon));color:#fff;box-shadow:0 4px 15px #6c5ce74d}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 20px #6c5ce780}.btn-ghost{color:var(--text-primary);border:1px solid var(--btn-ghost-border);background:0 0}.btn-ghost:hover{background:var(--glass-bg-hover)}.hover-bright:hover{background:var(--glass-bg-hover)!important}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.5s forwards fadeIn}