:root{--primary:#4361ee;--primary-light:#4895ef;--secondary:#3f37c9;--success:#0ba30f;--danger:#f72585;--warning:#f8961e;--light:#f8f9fa;--dark:#212529;--gray:#6c757d;--light-gray:#e9ecef;--border:#dee2e6;--shadow:0 4px 20px rgba(0, 0, 0, 0.08)}.preview-section{flex:1.2;min-width:300px}.settings-section{flex:.8;min-width:300px}.panel-title,.section-title{display:flex;align-items:center;gap:12px;font-size:1.6rem;font-weight:600;color:var(--dark)}.section-title{border-bottom:2px solid var(--light-gray)}.panel-title i,.section-title i{color:var(--primary)}.panel{padding:10px;border-bottom:1px solid var(--border)}.test-instruction{color:var(--gray);font-size:1.2rem}.test-area{background:var(--light);border-radius:12px;padding:5px 20px;border:1px dashed var(--border);transition:all .3s ease;min-height:220px;display:flex;align-items:center;justify-content:center}.test-area:hover{border-color:var(--primary)}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:20px;margin-top:25px}.stat-card{background:var(--light);border-radius:12px;padding:20px;text-align:center;border:1px solid var(--border);transition:all .3s ease}.stat-card:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--primary-light)}.stat-value{font-size:2rem;font-weight:700;color:var(--primary);margin-bottom:8px}.stat-label{color:var(--gray);font-size:1.4rem;font-weight:500}.btn{padding:14px 32px;border:0;border-radius:10px;font-size:1.2rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .2s ease;box-shadow:var(--shadow)}.btn-primary{background:var(--primary);color:#fff}.btn-secondary{background:var(--light-gray);color:var(--dark)}.btn:disabled{opacity:.6;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.12)}.btn i{font-size:1.2rem}.click-zone,.controls{display:flex;justify-content:center}.controls{gap:15px;flex-wrap:wrap;margin:10px 0}#movement-canvas{background:rgba(67,97,238,.02);width:100%;height:100%;border-radius:8px;cursor:crosshair;border:1px solid var(--border)}.click-zone{width:120px;height:120px;background:rgba(67,97,238,.05);border:2px solid rgba(67,97,238,.3);border-radius:12px;align-items:center;transition:all .3s ease;cursor:pointer;margin:10px}.click-zone:hover{background:rgba(67,97,238,.1)}.click-zone.active{background:rgba(67,97,238,.2);transform:scale(1.05)}.click-zone,.test-result,.wheel-box{font-weight:600;color:var(--primary)}.wheel-box{width:98%;height:200px;background:#fff;border:3px solid rgba(67,97,238,.3);border-radius:16px;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:1.2rem;transition:all .3s ease;cursor:pointer}.wheel-box:hover{border-color:var(--primary)}.wheel-box i{font-size:2.6rem}.wheel-box.highlight{background:rgba(67,97,238,.1)}.test-result{font-size:1.4rem;margin-top:33px;text-align:center;min-height:30px}.test-result i{font-size:1.6rem;margin-top:5px}.progress-container{width:100%;height:8px;background:var(--light-gray);border-radius:4px;margin:20px 0;overflow:hidden}.progress-bar{height:100%;width:0%;background:var(--primary);border-radius:4px;transition:width .3s ease}.result-panel{padding:30px}.result-header{text-align:center;margin-bottom:10px}.result-header h2{font-size:2rem;color:var(--primary)}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:25px}.result-card{background:var(--light);border-radius:12px;padding:25px;text-align:center;transition:all .3s ease;border:1px solid var(--border)}.result-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.result-value{font-size:2rem;font-weight:700;margin:15px 0}.mouse-icon{font-size:2.5rem;margin-bottom:15px;color:var(--primary)}.test-pass{color:var(--success)}.test-fail{color:var(--danger)}.alert-modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.7);display:flex;justify-content:center;align-items:center;z-index:1000;opacity:0;pointer-events:none;transition:opacity .3s ease}.alert-modal.active{opacity:1;pointer-events:all}.alert-content{background:#fff;border-radius:16px;padding:40px;max-width:500px;width:90%;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.3);transform:translateY(30px);transition:transform .3s ease}.alert-modal.active .alert-content{transform:translateY(0)}.alert-title{font-size:2.6rem;color:var(--primary);margin-bottom:20px}.alert-message{font-size:1.4rem;color:var(--gray);margin-bottom:30px;line-height:1.6}.alert-btn{padding:15px 40px;font-size:1.2rem;background:var(--primary);color:#fff;border:0;border-radius:10px;cursor:pointer;font-weight:600;transition:all .3s ease}.alert-btn:hover{transform:translateY(-3px);box-shadow:0 10px 20px rgba(67,97,238,.3)}@media (max-width:600px){.test-area{min-height:150px}.click-zone{width:80px;height:80px}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:20px;margin-top:25px}.result-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:25px}.alert-content{background:#fff;border-radius:10px;padding:20px;max-width:100%;width:90%;text-align:center;box-shadow:0 20px 50px rgba(0,0,0,.3);transform:translateY(30px);transition:transform .3s ease}}